In layouts\main.php I added an image which should be shown on every page at the same place (header). I added following code in main.php (layout):
...
<div class="intl">
<a href="http://www.example.org" target="_blank>
<img src="../files/wsk/design/intl.png" alt="Text" align="right"> </img>
</a>
<br>
International
<div>
...
The image is shown on the homepage but not on subpages like About or Contact as shown on the pictures attached. Would be glad if anybody could tell me why.
This is because you used related path for image (with ..).
It's recommended to place such images in web accesible directory (web), in subfolder images for example, then access it like that: /images/design/your-image-name.jpg.
If your image is outside of web accessible directory, alternatively you can use assets to publish it there.
Looks like it might be to do with using the relative URL in your img tag. Try this:
<img src="<?php echo Yii::app()->baseUrl; ?>files/wsk/design/intl.png" alt="Text" align="right">
If that still doesn't work, check your baseUrl in your configuration is correctly pointing to the folder with your index.php to make sure your URLs are all resolving properly.
In your layouts/main add Html helper
<?=
use yii\helpers\Html;
?>
Now you can display the image by
<?= Html::img('path/to/your/imagefile', ['alt' => 'text', 'height' => '28', 'width' => '112']) ?>
or you can create a uploads folder in the root of the project and create an alias for it. That will make your job easy for image display in all the pages. You can use the below code to display an image if alias is set for uploads folder
<?= Html::img('#uploads/imagefile', ['alt' => 'text', 'height' => '28', 'width' => '112']) ?>
Related
I'm making a Landing page and I want to put there some png images links but they don't show. When I set png as background image I saw it on the page but casual <img>doesnt work. Path of the file is okay, I'm sure of that, but console says "404 file not found".When I'm using exactly the same path as bg image it works perfectly I don't know why... I'm writing styles in SCSS and using components for different parts of the site if it matters.
Plz help I'm new T.T
here are the links
<div id='media'>
<a target='_blank' href="https://en.wikipedia.org/wiki/Facebook">
<img src="/src/images/facebook.png" alt="ikona facebooka">
</a>
<a target="_blank" href="https://pl.wikipedia.org/wiki/LinkedIn">
<img src="/src/images/linkedin.png" alt="ikona linkedin">
</a>
</div>
and structures of my folders looks like that:
./src:
../fonts
../images<--here are the png files
../js
../sass
../templates:
.../components
...index.html
./web:
../css
../images
..index.html
Your styles.css file is located in a different place than your template files so the path SHOULD be different.
From your stylesheet location
web/css/style.css -> ../../src/images/filename.png
From your template location
src/templates/index.html -> ../../web/images/filename.png
Here's what to do to troubleshoot file paths:
Open dev tools => network tab (select images in your case)
Look for the file in question
If it's 404ing your path could be bad.
Try to load your image in a new browser tab with the full URL path you THINK it should be. (make sure it's serving properly)
Then check that full/serving file URL against the URL in your code
Is this a WordPress site? If so make sure to output the full path with
<?php bloginfo('template_directory'); ?>/path/filename.jpg
Remove the '/' from the beginning of the image path.
So change this:
<img src="/src/images/facebook.png" alt="ikona facebooka">
To this:
<img src="src/images/facebook.png" alt="ikona facebooka">
I have two image descriptions in HTML on my local PC:
<IMG src="url('myimage.png')"></IMG> <!-- this I call "explicit" -->
<IMG src='myimage.png'></IMG> <BR>
Neither Mozilla, nor IE do show the first image. Naturally, I tried to interchange apostrophes or omit apostrophes and so on...
Why don't browsers seem to see an image described by the 'url' keyword?
You can only specify an image using a relative or an absolute URL. The url keyword is used in CSS to express an image location.
Refer to http://www.w3schools.com/tags/att_img_src.asp for more info on the img src attribute.
Some working examples:
Relative url, can only be used if the html file in on the same dir:
<IMG src="myimage.png"></IMG>
Relative url #2, can only be used if myimage.png is on dir images inside the same dir as the html file :
<IMG src="images/myimage.png"></IMG>
Absolute url - can be used from anywhere
<IMG src="http://something.com/images/myimage.png"></IMG>
The same as the above, without including the website, must be used inside domain something.com
<IMG src="/images/myimage.png"></IMG>
How can I add a logo + title to a Yii2 web app?
I used concatenation to stick logo to title (as below)
NavBar::begin([
'brandLabel' => '<img src="favicon-32x32.png"; class="img-responsive">'.'Car Management System',
and it worked but the logo appeared on top of the title.
Is this a wrong way to make it?
Or is it right but it needs some style properties changed?
See if this works for you, it just changes the <img> syntax to be correct:
'brandLabel' => '<img src="favicon-32x32.png" class="img-responsive"/>Car Management System',
If you are having problems with the image and the text not sitting on the same line, you probably want to replace the img-responsive class with the pull-left class... or just remove the img-responsive class and it may start working (depending on the styles already applied to the image). Example:
'brandLabel' => '<img src="favicon-32x32.png" class="pull-left"/>Car Management System',
I have the same issue, in addition I have a square image of 48x48. I have solved it like your initial solution but with the help of the following style attribute's values:
...
'brandLabel' => '<img src="logo.png" style="display:inline; vertical-align: top; height:32px;">My Company',
...
The final result is shown in the following screen shot:
I have an image which serves as an a href, the following a href doesn't work:
<div id="buttonNext">
<a href="1-5/redrum-10">
<img id="buttonNextImg" src="../../resources/img/buttonImg/next.png"/></a>
</div>
Me clicking on the link results in me being redirected to this website:
http://localhost/redrumwordpress/wordpress/redrum-10/
which also exists, but it doesn't link me to the correct website, the following code does work and links to the correct website:
<div id="buttonNextBottom">
<a href="1-5/redrum-5/">
<img id="buttonNextImgBottom" src="../../resources/img/buttonImg/next.png"/></a>
</div>
Which re-directs me to the correct page:
http://localhost/redrumwordpress/wordpress/1-5/redrum-4/
I've checked if I missed something like a / or ../ maybe it was in the wrong folder.
I've checked for the file not being there, but it is and it isn't corrupt.
Could anyone help me with why WordPress won't link to the correct website, when I use this website outside of wordpress it works just fine.
Can't you use:
<?php bloginfo('url'); ?>
Which will get your site address, then add the link path relative to this?
In the code below, I am using an image images/newlogo.PNG for a logo. I am trying to add the same logo to a WordPress blog, but WordPress can't seem to find the logo. Any idea where I should put the image so that WordPress can find it?
Thanks in advance,
John
<div class="newlogo">
<a href="index.php">
<img src="images/newlogo.PNG" alt="Books" border="0"/>
</a>
</div>
My experiece with WordPress is many times you need the full path for images called outside of the style sheet, because your full path is something like username/public_html/wordpresshere
Best to put images in your theme so they stay put whn you change themes or go along when you download/backup themes
So, hardcode your full path from your URL, or:
Use this to return site URL:
<?php bloginfo('url'); ?>/wp-content/themes/default/images/newlogo.png
Or this to return the current template directory:
<?php bloginfo('template_directory'); ?>/images/newlogo.png
Like this:
<img src="<?php bloginfo('template_directory'); ?>/images/newlogo.PNG" alt="Books" border="0"/>
If you use an 'absolute' path (relative to the server) like this:
<img src="/images/newlogo.PNG" alt="Books" border="0"/>
You just need to put the image in the images folder in the root of the server
I think you need to have the file in the wp-content folder.
If you are adding this code into a theme file, you need to use the path to the image directory within the theme directory. This can be done by using get_template_directory_uri().
Here is an example:
<div class="newlogo">
<a href="index.php">
<img src="<?php echo get_template_directory_uri(); ?>images/newlogo.PNG" alt="Books" border="0"/>
</a>
</div>