I am working on a WordPress website locally, where I am currently trying to dynamically call a Custom Header. I am using the following code:
<img src="<?php header_image(); ?>" height="20%<?php echo get_custom_header()->height; ?>" width="20%<?php echo get_custom_header()->width; ?>" alt="header-image" />
The above code, outputs the following line to the Browser:
<img src="http://localhost/wordpress-folder/wp-content/uploads/2017/10/image.jpg" height="20%3484" width="20%2439" alt="header-image" />
Though the above code successfully calls the Custom Header, it does fail W3C Validation. The error message is as follows:
Bad value 20%3484 for attribute height on element img: Expected a
digit but saw % instead.
The only way I can seem to remove this error, is by removing the % (px also produces the error) and only leave in the number.
Is there a way I could continue using Pixels/Percentage other than reorganising my code, so that I could implement some Inline/External Style Sheets?
You are using HTML height and width attributes. When you pass values to them you cannot pass the metric (e.g.: %, px etc) to it.
You will have to change your line to:
<img src="<?php header_image(); ?>" height="<?php echo get_custom_header()->height; ?>" width="<?php echo get_custom_header()->width; ?>" alt="header-image" />
Hope this helps. :)
This should throw an error as it's not in a correct format. It should be either in % format or px format. 20%3484 is an incorrect format.
If you want to give fixed height, you can use this:
<img src="<?php header_image(); ?>" height="<?php echo get_custom_header()->height; ?>" width="<?php echo get_custom_header()->width; ?>" alt="header-image" />
or if you want to use %, then use this:
<img src="<?php header_image(); ?>" height="20%" width="20%" alt="header-image" />
But you can only use one of them.
Let me know if it helps.
Related
I create a block from configuration. Inside this block, I write this code...
<div class="provider-bg" id="provider1">
<img alt="" class="img-responsive" src="<?php echo base_path().path_to_theme() ?>/images/provider-1.jpg" />
</div>
Then, I save with PHP in text format.
My virtual host is ... http://localhost:8888/drupal
So, the image path will be like this ...
<img alt="" src="/drupal/sites/all/themes/myancast/images/ios.png">
This image appears in the last few days ago. Today, I run the site and that image disappear immediately and got 403 error.
Failed to load resource: the server responded with a status of 403 (Forbidden).
I'm trying to find the solution the whole day. But, I still cannot solve.
Can anyone help me please ?
Add global $base_url in your code and use like below
<img alt="" class="img-responsive" src="<?php echo $base_url.'/'.path_to_theme(); ?>/images/provider-1.jpg" />
did you try this ?
<img alt="" class="img-responsive" src="<?php echo '/'.path_to_theme(); ?>/images/provider-1.jpg" />
try this,
<?php
$imgurl = file_create_url(path_to_theme().'/images/provider-1.jpg');
?>
<img alt="" class="img-responsive" src="<?php echo $imgurl ?>"/>
I'm trying to add a thumbnali image to the view order page in the account section with the following code but it doesn't do anything:
<td>
<?php $_product = Mage::getModel('catalog/product')->load($_item->getId()); ?>
<img src="<?php echo Mage::helper('catalog/image')->init($_product, 'small_image')->resize(135); ?>" width="135" height="135" alt="" />
</td>
Any ideas why this is not working?
Try the codes given below:
First load the product
$_product = Mage::getModel('catalog/product')->load($_item->getProductId());
Then show the thumbnail where you want using the code given below
<img src="<?php echo Mage::helper('catalog/image')->init($_product, 'thumbnail')->resize(75, 75); ?>" alt="<?php echo $this->htmlEscape($_item->getName()); ?>" border="0" width="75" />
I've encountered this issue a couple times but have always found a "hack" way around it. Is there a special way to link an image in a WordPress template to an outside url beyond the typical a href tag? Here's the images I'm trying to link to outside urls:
<div class="socialMedia">
Follow Us: <br />
<img src="<?php echo get_bloginfo('template_url') ?>/images/facebook.png" alt="facebook"/>
<img src="<?php echo get_bloginfo('template_url') ?>/images/twitter.png" alt="twitter"/>
<img src="<?php echo get_bloginfo('template_url') ?>/images/googleplus.png" alt="google plus"/>
<img src="<?php echo get_bloginfo('template_url') ?>/images/instagram.png" alt="instagram"/>
</div><!--.socialMedia-->
<div class="socialMedia">
Follow Us: <br />
<a href="<?php echo get_bloginfo('template_url') ?>/images/facebook.png" target="_blank" > <img src="<?php echo get_bloginfo('template_url') ?>/images/facebook.png" alt="facebook"/> </a>
</div><!--.socialMedia-->
did you mean it!!?
<img src="…/<?php echo "$ArtFilePath"; ?>">
gives me this. It’s actually the one I want only without the …
http://markdinwiddie.com/PHP2012/.../artwork/Drawings/Boy.jpg
<img src="../<?php echo "$ArtFilePath"; ?>">
give me this
http://markdinwiddie.com/artwork/Drawings/Boy.jpg
<img src="/../<?php echo "$ArtFilePath"; ?>">
gives me this
http://markdinwiddie.com/artwork/Drawings/Boy.jpg
and
<img src="/…/<?php echo "$ArtFilePath"; ?>">
gives me this
http://markdinwiddie.com/.../artwork/Drawings/Boy.jpg
What I need is
http://markdinwiddie.com/PHP2012/artwork/Drawings/Boy.jpg
Who knows the order of dots and slashes?
Since $artFilePath == "artwork/Drawings/Boy.jpg", you want either:
Relative urls
Provided your php file is within /PHP2012/ this will work. It will even work if you rename the directory
<img src="<?php echo $ArtFilePath ?>" />
Which outputs
<img src="artwork/Drawings/Boy.jpg" />
Absolute urls
<img src="/PHP2012/<?php echo $ArtFilePath ?>" />
Which outputs
<img src="/PHP2012/artwork/Drawings/Boy.jpg" />
if the webpage is within the PHP2012 folder: http://markdinwiddie.com/PHP2012/
and your image is in artwork/Drawings/Boy.jpg within the PHP2012 folder
can't you just do <img src="<?php echo "$ArtFilePath"; ?>">
Not even sure if methods is the correct terminology...
Here is the original working code:
<a href="<?php bloginfo('url'); ?>">
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title"><?php bloginfo('description'); ?></p>
I wanted it to only execute on the homepage, so I wrote this:
<?
if ( $_SERVER["REQUEST_URI"] == '/' ){
echo '<a href="'.bloginfo('url').'">
<img src="'.bloginfo('stylesheet_directory').'/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="'.bloginfo('stylesheet_directory').'/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title">'.bloginfo('description').'</p>';
}
?>
But it outputs the bloginfo() and the other declarations completely outside the html tags I have created. For instance, with bloginfo('stylesheet_directory') it will display the directory outside the IMG tags I created.
Any ideas? Apparently my syntax isn't correct or something....
bloginfo function directly echoes the output. In this case you should use get_bloginfo to add the returned value to the string and echo the complete string. I believe this will work
<?php
if ( $_SERVER["REQUEST_URI"] == '/' ) {
echo '<a href="'.get_bloginfo('url').'">
<img src="'.get_bloginfo('stylesheet_directory').'/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="'.get_bloginfo('stylesheet_directory').'/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title">'.get_bloginfo('description').'</p>';
}
?>
Here is a better alternative:
<?php if ( $_SERVER["REQUEST_URI"] == '/' ) { ?>
<a href="<?php bloginfo('url') ?>">
<img src="<?php bloginfo('stylesheet_directory') ?>/images/logo.png" alt="Polished Logo" id="logo"/>
</a>
<img src="<?php bloginfo('stylesheet_directory') ?>/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title"><?php bloginfo('description') ?></p>
<?php } ?>
I also suggest using the is_home() function provided by wordpress to check for the homepage instead of checking the $_SERVER['REQUEST_URI'] value.
bloginfo() outputs data with echo and returns nothing, so instead of trying to concatenate everything, just output in sequence, e.g.
echo '<a href="';
bloginfo('url');
echo '"><img src="';
bloginfo('stylesheet_directory');
//etc...
Ugly I know, but see answer by Nithesh for a possible alternative.
if you want to get the template path without auto echoing it by the bloginfo() function use:
get_bloginfo( 'stylesheet_directory', 'display' )