Joomla doesn't show images in frontend - html

I created a Joomla template and in my index.php file there are images.
So the template work and everything is shown up exept the images. There is only the picture symbol.
I'm using the newest version of Joomla. Joomla 3.8.6
I placed the images in the Joomla images foolder and also in the template images folder.
Is there any solution?

The path to the images is wrong. Check your browser developer tools and it will tell you what path it is trying to load the images from.
Crucially though, you should not be putting images in index.php, that is not how Joomla works. It is a CMS, you don't hardcode asset paths in the index template.

Related

Github pages: Image shows correctly in markdown, not on website

I am using Github Pages + Jekyll for a blog. I'd love your help!
I just uploaded a post, including an image. After I commit changes I can see the picture properly displayed within the preview, but not in the browser. I also checked on a different browser and on my phone to ensure its not my cache or sth like that.
Code:
How it looks on Github preview:
This is how the image shows on my browser:
I saved the file in the folder images where the .md file is located.
Link to the full code here
Link to the blogpost here
I make PR.
This is raw url.
Please check this.
https://github.com/financenerd/financenerd.github.io/pull/1/files
Jekyll does not copy assets placed in the _posts folder. Therefore your image is missing after build.
You have to put the image in another folder (not starting with an underscore). Like /assets/img/ or /assets/images at the root of your project.
Then in your post, in markdown
![image](/assets/img/ZAK.JPEG)
or
![image]({{site.baseurl}}/assets/img/ZAK.JPEG)
With Github page, you also have this option: https://nhoizey.github.io/jekyll-postfiles/ but I can't speak for experience.

After Angular ng build --prod, all image on home page are not displayed

I am working on an angular webpage. When I am using ng start, all the images on my home pages are successfully being displayed and visible. I build my angular project again with ng build --prod. I know that this --prod flag minimizes the filesize but when I deployed to the IIS web server, I don't see any of the images on the home page.
Even with the minimize file, I can still see the image with the ng start but not with IIS. 
In my HTML file, I reference the image with code like this
All of my images are located inside a folder call assets/img. The following shows my IIS folder content. 
Have anyone else have this issue? Any help is greatly appreciated.
The minimized files works with Angular 6 when start with the command line ng start. When I copied the files to the IIS folder, there are no display images. I am wondering if there is something I need to set on IIS. I checked and the Static Content is set under Internet Information Services. I also copied and pasted all the images in the folder and each of the subfolder but still no images are displayed.
Thanks

mitigate static html pages from xampp to wordpress

I have developed a website using xampp. And I want it to replace a current website on Wordpress.
I tried looking for tutorial/steps online, have tried a few, nothing seems to work.
I desperately need to upload it, so it would replace the current website. So any help would be greatly appreciated.
P.S: the website is fully static, no database is required.
Remove everything in the wordpress folder (or move it to a subfolder for the time being while you test) via ftp and upload the html site. As long as your new site has a index.html/index.htm it will replace the wordpress site at the url.
Step 1. Create Template in theme folder
Step 2. Give Template at the top of the page Like this
Step 3. Place all Html code below the template name
Step 4. Go to wordpress dashborad choose your template 'CustomPageT1' from dropdown
Further Detail check the link below
For Example: http://www.wpbeginner.com/wp-themes/how-to-create-a-custom-page-in-wordpress/

How single page HTML site without any CMS

I want to make a single page HTML site. I have made the template, but I wanted to know how to make it go live on my hosting.
I have tried many things but none of them work, I don't want to use any CMS, just a plain and simple HTML site. I have both a domain and hosting.
If as "template" you mean HTML file than you should name your file as index.html and upload it via FTP to the work directory of your hosting server.

Css text won't load background url images on website?

I used notepad++ with html5 and css3. The problem is that the css isn't loading the images, though in the editor it did. I need help. here's my text for one of the images named content, and yes the content tag is on purpose since it's id:
#content{
width:900px;
height:600px;
background:url(images/content.png);
border-radius:20px;
}
So, the folder is on desktop, it's named images and the image is a png named content. It worked on the editor but it's not showing up on the website. On the website it's just showing the grey background.
I took screenshots of it working in edit viewer and it on the actual website.
http://postimg.org/image/mdeso350h/ -- looks fine on edit viewer
http://postimg.org/image/gb75xlgkh/ -- not working on website
First you need to check the file path of css and the images.,
I think this is your file structure
--folder
----index.html
----name.css
----content.png
so, just try that background:url(content.png); this will help you
incase your file structure like
--folder
----index.html
----name.css
----images/content.png
in this case your style works fine background:url(images/content.png);
Always use quotes for linking images like;
background-image: url("images/content.png");
And inside your root folder in your server (in x10host.com), use file manager to create a folder named images where you have uploaded your file index.html, and then you can see index.html file and images folder in a single place. Then upload your images to images folder. Hope this helps.
Sometimes design tools tend to save file extensions capitalized (.PNG for example), and not every server is aware of that, so you should be.
Check your folder location of the image as well.