Right way to get image path - wordpress

Called the images in my theme as shown below
<img src="<?php bloginfo ('stylesheet_directory');?>/images/blogo.png" />
It worked perfectly until I installed a Child Theme. I had to change
<?php bloginfo ('stylesheet_directory');?>
to
<?php bloginfo ('template_directory');?>
Before it started working again. Just need help understanding why that happened. Thanks

stylesheet_directory is the directory that contains the main stylesheet in use (so if you have a child template then it would be the child directory. If not, it will be the template directory.
template_directory is the directory of your parent theme.
Look at the codex for more details

Stylsheet directory links to the main stylesheet, and not the child theme( since the child theme may not contain the style.css by default, it inherits the style.css of parent theme. So the parent path is called if you are using this).
So always use get_stylesheet_uri() or get_template_directory_uri() for these purpose.
Hope this clarifies you.

Related

Best practice for removing parent theme CSS assets etc. without editing parent's functions.php

I am currently developing a child theme that builds on twentyfifteen as a parent theme. However a potential issue has cropped up that is causing a problem.
I want to strip the CSS and JS assets from the parent theme twentyfifteen, but these are loaded from the theme's functions.php file with wp_enqueue_style and wp_enqueue_script, I have commented out these lines in the functions.php file so that now these CSS and JS assets are not longer loaded - but isn't it he case that if an update is released for the twentyfifteen parent theme, that when it is updated - the functions.php file will be overwritten along with any commenting out I have done. So in other words when it is updated the unwanted CSS and JS assets will be reloaded.
What is the best solution here? Can I prevent twentyfifteen loading it's stylesheet and JS without editing it's functions.php file (as this file will only be updated and changes overwritten?) Surely there is a better way of doing this.
I'm currently developing a child theme for with a base of twentyfifteen and have been left wondering if it would just be best to create an independent theme rather than a child theme as a workaround to this issue.
Try <?php wp_dequeue_style( $handle ) ?> where $handle is the name (slug) of the enqueued stylesheet. Similarly <?php wp_dequeue_script( $handle ); ?> for scripts.
See the codex:
https://codex.wordpress.org/Function_Reference/wp_dequeue_style
https://codex.wordpress.org/Function_Reference/wp_dequeue_script

wordpress. html/css to theme..link to images?

Im trying to create my own WP-theme from my html/css-site.
I managed to migrate the html/css but the images won´t show up.
I realise that i have to change the img src-path but do i also have to add som php?
What does the path look like?
Thanks!
Are the images intended to be part of the theme? If so, then I'd recommend making a directory called images or something similar (I've seen some people use assets) in the theme's root directory (ie, wp-content/themes/[theme]/images).
Then you should be able to access them using get_template_directory_uri(), like so:
<img src='<?php get_template_directory_uri(); ?>/images/your-image.ext'>
If you're creating a Child Theme, and want to allow overrides of the parent themes images, replace get_template_directory_uri() with get_stylesheet_directory_uri().
References
get_template_directory_uri()
get_stylesheet_directory_uri()
Child Themes

stylesheet child theme issue - woothemes canvas

I encountered a problem with my wordpress (canvas) site in ie8 and traced it to the stylesheet link in the header of my child theme - this code:
href="<?php bloginfo('stylesheet_url'); ?>"
translates in the browser as "...canvas-child/style.css" which is wrong - according to woothemes instructions you should customize css in your child theme with 'custom.css' only, and leave 'style.css' in your parent 'canvas' theme. I really need to know 1. is this an error 2. what should this php code be pointing to? Thanks.
Check out: http://codex.wordpress.org/Child_Themes for information on child themes.
style.css is the one and only required file in a child theme. It provides the information header by which WordPress recognizes the child theme, and it replaces the style.css of the parent.
When you use Child Templates, just copy a file with the same name to your child theme and enter your adjustments here.

Wordpress Child Theme CSS Import

I am creating a Wordpress JigoShop Online Store. Having bought their Jigotheme, I have created a child theme and activated it (with Jigotheme as parent template).
I tried to import the styles from the jigotheme using:
#import url("../jigotheme/style.css");
(as per wordpress instructions)
The stylesheet is not pulling in - child theme works fine aside from this CSS import issue.
I know that no code can be above the #import code in the stylesheet - but would it not be working because the parent style.css also has #import code at the top of it? Are they conflicting perhaps?
Any help would be really appreciated!
You could just add an other <link>element to the head or enqueue it.
The import statement should work. Double check the directory path and .css filename. If you're using Chrome, you can check the network tab to see if the parent style.css is actually being accessed.
Follow few steps:
Replace bloginfo('template_directory'); ?> with php bloginfo('stylesheet_directory'); ?> (Credit goes to #WouterB)
Check if your parent theme using stylesheet which is located under sub-folder (eg. theme/css/style.css), in this case you have to place your child theme css under that folder.
Remember to change path (may be you have to ../ before previous url)

Wordpress Child-Theme CSS not Reflecting on Site

I've semi-successfully created a wordpress child-theme. By successfully I mean:
I managed to create a child-theme directory in my themes folder, next
to my main theme
I created a style.css file in the child-theme dir
I saw the style show up on my Wordpress back-end and managed to activate it
I added templates (header.php, sidebar.php,...) to the directory
I made changes to the above templates and saw the changes on my site
However, there is one huge problem:
Whatever CSS I try to add to the style.css file, it's not affecting the site
I know the "information header" must be ok since I was able to see/activate the child-theme. But I really can't figure out what is wrong. I tried removing the #import rule, which according to the Wordpress codex should remove all styles from my site - nothing happened.
I'm using the Panorama theme and created "panorama-technology" as a child. Below you can see the code I have in the style.css file inside the child-theme: "panorama-technology":
/*
Theme Name: panorama-technology
Template: panorama
*/
#import url("../panorama/style.css");
#search{
margin: 15px 15px 0 0;
}
WouterB, I had the same problem with my child theme loading in the backend, and child php pages overriding the parent theme php pages, but NO child CSS changes loading to override the parent styles.
So,although with different coding, it turns out my parent theme was written in such a way that the header was also looking for the stylesheet in the template directory, so your solution was spot on in concept.
Thus, by changing the call in the header from :
<link rel="stylesheet" type="text/css"
href="<?php echo get_template_directory_uri();?>/style.css" />
to:
<link rel="stylesheet" type="text/css"
href="<?php echo get_stylesheet_directory_uri();?>/style.css" />
--did the trick like magic. At least as far as I can tell so far.
You get major credit in my book!
First I'd try an absolute path to be sure that the path isn't the problem. If that does not solve the issue. Place the #import at the very top of the css file or directly after thelast "*/". I think white space is probably the culprit here.
Do not use import.
Add time after css uri for refreshing everytime.
In your function.php
function child_style() {
wp_enqueue_style( 'parent-child', get_stylesheet_uri().'?'.time());
}
add_action( 'wp_enqueue_scripts', 'child_style', 20 );
Watch out from caching :
wp cache plug-ins
server side cache (APC etc.)
local browser cache

Resources