I need to change relative paths to absolute paths in my WordPress page. My image links are broken in sub pages.
For example I need to change
../url/image.png
to
www.site.com/uploads/image.png
In your theme files, replace
<img src="../url/images.png">
with
<img src="<?php echo get_template_directory_uri(); ?>/url/images.png">
You can also do a search and replace. Search for ../ and replace with <?php echo get_template_directory_uri(); ?>
Related
I have an image folder in a child directory where some theme-related gfx is located. If I want to access it via:
<img src="<?php echo get_template_directory_uri();?>/assets/Logo.svg" />
It's trying to look for /assets in the parent theme directory.
How can I reference the child theme directory?
The function get_template_directory_uri always return the url of Parent Theme. Don't matter, where you called it.
To get the url of your Child Theme, you can use get_stylesheet_directory_uri(). So, your code will be:
<img src="<?php echo get_stylesheet_directory_uri();?>/assets/Logo.svg" />
I have already set up a child theme. Is it possible to add via FTP on my server a folder (preferably into the same child theme folder) called img and then link to the images in that folder from my pages and posts?
I tried using this path:
<img src="../wp-content/themes/theme-child/img/placeholder.png"/>
but that did not work.
You need to use the stylesheet directory instead. With a child theme, if you use the template directory it will go to the parent (see explanation on http://codex.wordpress.org/Function_Reference/get_stylesheet_directory_uri).
It should be <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/placeholder.png" />
Replace with the following code
<img src="<?php echo get_template_directory_uri(); ?>/img/placeholder.png" />
Yes you can. You can then access it by doing...
get_template_directory_uri().'/img/placeholder.png'
Tested script
src="<?php echo get_stylesheet_directory_uri(); ?>/images/welcome.png" alt="">
See Reference link
You can create img folder inside your Child Theme directory and can access it via the same way as core/parent theme directory reference get_template_directory_uri(). This will return the Child Theme directory URI as you're referring this in Child Theme.
<img src="<?php echo get_template_directory_uri(); ?>/img/childthemeimage.png" alt="Child Theme Image">
get_stylesheet_directory_uri()
will return the URL of the child theme while
get_template_directory_uri()
Will return the parent theme URL
Hello I want to insert my logo to my wordpress site
<img src=”/wordpress/wp-content/themes/test/images/logo.png”>
that is my FTP Path to the image but it's still does not work. When I refresh my site a image icon appears but it does not show my logo... Why? It seem that the PATH don't work right? Any suggestions what could be wrong or is there any special WP Query I need to use? Seems like it? Can't find tho..
Thanks
You shouldn't be using an absolute path to an image file. This would be useful if you wanted to get the files attributes in PHP but not when you want to show the image on the page.
There are two functions you should familiarise yourself with:
get_template_directory() - This will get the absolute path to the theme directory.
get_template_directory_uri() - This will get the theme directory URI.
Correct way to link to the image file:
<img src="<?php echo get_template_directory_uri(); ?>/images/logo.png">
Don't forget to add an alt attribute.
Use below function for site URL
site_url();
replace this with you img code
<img src="<?php echo site_url("/wp-content/themes/test/images/logo.png"); ?>">
use something like this
<img src="<?php bloginfo('template_url'); ?>/images/logo.png" />
I am building a Wordpress website from HTML/CSS/JS templates i made earlier. However this is my first time using it and im really struggling. There are plenty of resources and solutions however none seem to be working for me, for example; one tutorial pointed out you could create template pages if you go into your management screen > pages > add new > page attributes > template. But under page attributes is only "order" although it does claim there should be a template bit if you click help.
I've managed to link my stylesheet but none of my images are appearing. They are all in a folder named images within my theme directory.
In my external stylesheet i have:
body{
background:url("images/subfolder/image01.jpg");
}
I have also tried:
body{
background-image:url("images/subfolder/image.jpg");
}
In my html I have:
<img src="<?php echo get_template_directory_uri(); ?>/images/subfolder/image02.png" alt="DESCRIPTION" />
I have also tried:
<img src="<?php bloginfo('template_directory'); ?>/images/subfolder/image02.png" alt="DESCRIPTION" />
I can't seem to get any of these up.
Here is the deal:) Your folder structure "must" look like this
-Yourtheme Folder
index.php
style.css
page.php
single.php
...other files
-images (images folder)
-js (js folder)
So if you are developing a theme full image path will not help you much because you simply don't know how will your clients domain look, like it can be http://www.mydomain.com/somefolder/ but it can also be http://www.mydomain.com/somefolder/subfolder/anothersubfolder so to access your images use relative paths like this:background-image:url('../images/myimage.jpg'); that way images will work no matter how your domain path will look.
Now to templates:)
In order to wordpress recognize that you are having a template create a file and name it mycooltemplate.php (you can name it however you want)
Your first line inside your template file must read something like this:
<?php /*Template name: This is my cool template*/
?>
That way wordpress will know that you are using a template and you can access it inside
management screen > pages > add new > page attributes > template
So to give a real world example let's create our first template shall we?
We will now create an simple archive template.
Open your text editor and add this code
<?php
/*
Template Name: My Cool Archives Template
*/
get_header(); ?>
<div id="container">
<div id="content" role="main">
<?php the_post(); ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php get_search_form(); ?>
<h2>Archives by Month:</h2>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
<h2>Archives by Subject:</h2>
<ul>
<?php wp_list_categories(); ?>
</ul>
</div><!-- #content -->
</div><!-- #container -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Save it as archives.php (name it however you want) and upload it to your theme folder. So now your folders should look like this:
-Yourtheme Folder
index.php
style.css
page.php
single.php
archives.php (your first template yeeey!!)
...other files
-images (images folder)
-js (js folder)
Hope this helps...
Try specifying the full path to the themes directory from your web root.
eg. /wp-content/themes/[yourtheme]/images/subfolder/image01.jpg
The image paths should work in your CSS but in your HTML/PHP you will need to use something like
<img src="<?php bloginfo('stylesheet_directory'); ?> /images/subfolder/image02.png" />
i have created a custom static html page
by adding a php file in
wp-content/themes/myactivetheme/
containing essentially
<?php
/*
Template Name: test
*/
?>
<div><p>blablabla</p>
<div><img src="content/images/thumb/00500_Partition_Vivaldi_Printemps.jpg" /></div>
i have placed the corresponding image file in
wp-content/themes/myactivetheme/content/images/thumb
When creating a new page with the dashboard using this test template , the text is displayed but not the image, why?
Probably the source address for the image is wrong. Don't use relative links. For example:
Instead of:
<img src="content/images/thumb/00500_Partition_Vivaldi_Printemps.jpg" />
Use:
<img src="<?php bloginfo('template_url'); ?>/content/images/thumb/your-image.jpg" />
It will help Wordpress to find the exact path to display your image.
Relative URIs will be relative to your WordPress index, so WordPress will look for the image in the wrong place. You could
move the image
hard code the image url
do it the clean and right way, which is <img src="<?php echo get_stylesheet_directory_uri(); ?>/content/images/thumb/00500_Partition_Vivaldi_Printemps.jpg" />
the image file had to be placed in
/wordpress/content/images/thumb