Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

What about images ? #9

Open
WagnerCaetano opened this issue Feb 24, 2023 · 4 comments
Open

What about images ? #9

WagnerCaetano opened this issue Feb 24, 2023 · 4 comments

Comments

@WagnerCaetano
Copy link

I tried to implement that and worked, but I can't make my images work because somehow they don't get imported into the page.

@stevewhitmore
Copy link
Owner

How are you targeting the images? Do you have an example I can see?

@WagnerCaetano
Copy link
Author

I'm creating it locally first, then I'll publish later.. but I was importing them like that:

<img src="../../../assets/img/profile.jpg" alt="" />

then after building I would change the '../../../assets' to './assets' because the folder of the assets is in the same folder that the main.js is after the build.. so it was suppose to work.. I've published websites like that before without they being wordpress plugins.. but them after I move all the content to wordpress plugins folder, It wouldn't appear on the page.

I solved that by importing the images directly from the wordpress media url, like that:
<img src="https://wagnercaetano.com/agency/wp-content/uploads/2023/01/unnamed.jpg" alt="" />

The only problem is that some SVG I wasn't able to upload into wordpress media.. but its alright..
Anyway if u find a way.. let me know please.. after I publish everything I can try reproduce the same scenario again for you to check..

@WagnerCaetano
Copy link
Author

I'm creating it locally first, then I'll publish later.. but I was importing them like that:

<img src="../../../assets/img/profile.jpg" alt="" />

then after building I would change the '../../../assets' to './assets' because the folder of the assets is in the same folder that the main.js is after the build.. so it was suppose to work.. I've published websites like that before without they being wordpress plugins.. but them after I move all the content to wordpress plugins folder, It wouldn't appear on the page.

I solved that by importing the images directly from the wordpress media url, like that: <img src="https://wagnercaetano.com/agency/wp-content/uploads/2023/01/unnamed.jpg" alt="" />

The only problem is that some SVG I wasn't able to upload into wordpress media.. but its alright.. Anyway if u find a way.. let me know please.. after I publish everything I can try reproduce the same scenario again for you to check..

This repo might be helpful:
https://github.com/WagnerCaetano/angular_resume_v2

@stevewhitmore
Copy link
Owner

I was able to reproduce your issue on my end. Nice catch! I never encountered it because I also target images in the WordPress media library but this is something that should probably be pointed out in the README.

I tried importing an image with require() and HttpClient but doing so requires using DomSanitizer.bypassSecurityTrustHtml() which seems to break when rendering within a WordPress installation. I'm not so sure if it's possible to target images in the Angular app's assets folder (I could be wrong, but no obvious solutions are standing out).

Regarding your issue with uploading svgs; have you tried doing so directly via FTP?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants