My navigation bar images and links load fine in CHROME but when loading the same page in INTERNET EXPLORER the images don't load but displays the no image icon. The links in IE are like this
CodeIgniter/index.php/news/index.php/news/
instead of just
CodeIgniter/index.php/news
HOWEVER, IE manages to load the css successfully even though that is also using the base_url()... here is my code:
test.php
<head>
<base href="<?php echo base_url() ?>">
<link rel="stylesheet" type="text/css" href="public/css/main.css">
</head>
<nav>
<ul>
<li><a href="index.php/news">
<img src = "public/images/home.png" alt="Home" title="Home"/>
</a></li>
<li><a href="index.php/news/create">
<img src = "public/images/create.png" alt="Create new article" title="Create new article"/>
</a></li>
</ul>
</nav>
config.php
$config['base_url'] = 'http://localhost/CIgniter/CodeIgniter/';
Answer
Quote:Well Fabios suggestion was successful thanks <img src = "<?=base_url('public/images/home.png')?>" alt="Home" title="Home"/> works even though it is gonna be a pain in future. Thanks for all your help!
Well Fabios suggestion was successful thanks
<img src = "<?=base_url('public/images/home.png')?>" alt="Home" title="Home"/>
works even though it is gonna be a pain in future. Thanks for all your help!
The real problem is that you are using relative paths e.g public/images/home.png instead of /public/images/home.png, the slash at the start tells the browser that it should retrieve content based on the absolute path you've specified at $config['base_Url'] = ... instead of the current path it is (I mean you get to CodeIgniter/index.php/news and you've specified a relative path to it so that's why it appened to it producing a wrong path CodeIgniter/index.php/news + index.php/news/)
so when you add a slash at the start of your path it will be refering to the absolute path and it will get to you at CodeIgniter/index.php/news.
Related
I am so confused what's the difference between those links below:
<link rel="stylesheet" href="http://<?php echo $_SERVER['HTTP_HOST'] ?>/demo/assets/css/style.css"
and
<li> HOME </li>
First of all, the first link is working very well, but the second link is not working. As it is written The requested URL /demo/contents/test.php was not found on this server.
My directory files is public_html > demo > contents > test.php. Any ideas?
Its best to use
$_SERVER['DOCUMENT_ROOT']
Then access the folder from the root directory.
For example:
href="http://<?php echo $_SERVER['HTTP_HOST'] ?>/demo/assets/css/style.css"
href="http://<?php echo $_SERVER['HTTP_HOST'] ?>/demo/contents/test.php"
Hope this helps :)
This is used for directly loading into the Page onload:
<link rel="stylesheet" href="http://<?php echo $_SERVER['HTTP_HOST'] ?>/demo/assets/css/style.css"
And this:
<li> HOME </li>
Is for user-actions, so you link a destination the user should be able to reach when clicking on it.
The header for my website is the same across all of it so instead of rewrite the code and link the style sheets, i've decided to use the <?php include ;?> to put it at the top of every document.
My issue is that the logo that should come with the header isn't displaying.
File Structure
As you can see, the header file is where it is and the logo named "Picture2.png" is in the image folder.
PHP
<?php include('./_/includes/header.php'); ?>
HTML (In header.php)
<nav id="navigation">
<ul id="navList">
<li id="navLogo"><img src="/image/Picture2.png"/>Computing</li>
<li><a class="navItem" href="gallery.php">Gallery</a></li>
<li><a class="navItem" href="topics.php">Core Topics</a></li>
<li><a class="navItem" href="courseview.php">Courses</a></li>
<li><a class="navItem" href="index.php">Home </a></li>
</ul>
</nav>
Part of header that isnt' displaying correctly
NOTE** everything else in the header is correctly displayed, I'm using a local server, should that make a difference
You are using an absolute path for your image.
You should put and use a relative path :
<img src="_/includes/image/Picture2.png"/>
instead of
<img src="/image/Picture2.png"/>
Yep, hes using an absolute path for image, but the project isn't in server root folder then you need's to inform the name of the folder in path...
Use <img src="/finalprojectneat/image/Picture2.png"> then you have your logo display on every page. But is not the most indicated because when you send to production server, you didn't have the "finalprojectneat" folder then you have to remove all paths using "projectneat".
One solution is to define a constant in your "index.php", not necessary in "index.php" but required in root folder of project
define ('_IMAGES_', realpath(dirname(__FILE__) . '/image'));
if you put this constant in another file inside root folder, use "require" to import these constants to your views...
and in your views, use
<?php echo _IMAGES_ . '/Picture2.png'; ?>
Using PHP (XAMPP)
I have a simple folder layout as such:
For right now, my index.php file just contains "mainbar.php"
mainbar.php:
<?php
require(config.php);
include ("login/session.php");
global $session;
$logged=$session->CheckSession();
?>
<!DOCTYPE html>
<html>
<head>
<script src='scripts/jquery.js'></script>
<link rel='stylesheet' href='styles/mainbar.css'/>
</head>
<body>
<section class='topcontainer'>
<nav id='mainnav'>
<ul>
<li><a href='#' class='acti' id='homepage'>Home<span class='badge red'>3</span></a></li>
<li><a href='qms/qms.php' id='qmspage'>QMS<span class='badge yellow'>35</span></a></li>
<li><a href='#' id='modelpage'>Model Search</a></li>
<li><a href='#' id='partsdbpage'>Parts Database</a></li>
<li><a href='#' id='wddbpage'>WD Database</a></li>
<li><a href='#' id='toolspage'>Tools</a></li>
<li><img src='styles/img/profile.png' width='25px'/></li>
</ul>
</nav>
</section>
When the user clicks on the "QMS" button (href='qms/qms.php').
I get the following error (using chrome):
Failed to load resource (http://localhost/control/qms/scripts/jquery.js)
PHP is going to the directory "qms" and then trying to find the "scripts" folder which I do not want it to do.
Keep in mind I just can't make it say "../scripts/jquery.js" because that may not always be the case.
How do I set this up so that "jquery.js" will have a permanent reference back to the parent folder "control/scripts/"??
you can just do as :
<script src='http://localhost/control/scripts/jquery.js'></script>
or use some global variable for this purpose
Amit suggests using the absolute path, but this is inflexible. You'll have to change the paths of these when you deploy the site, and if you ever change the name of your localhost, you'll have to manually update everything.
I'm assuming that your site's configured to use the root directory of localhost/controls. If this is the case, you should be able to link to the script from anywhere in the controls folder using "/scripts/jquery.js".
To find your root directory, run this in a PHP script: echo $_SERVER['DOCUMENT_ROOT'].
I am pretty new in WordPress and I have the following doubt about how to insert in my homepage an immage that is in a subfolder into my theme directory.
So I have the following situation: Into my custom theme directory I have the following folder that contains a jpg immage: /assets/img/flexslider/flex-1.jpg
Now in my header.php file I have something like this:
<li>
<img src="assets/img/flexslider/flex-1.jpg">
<div class="flex-caption">
<p class="flex-caption-text">
<span>Lorem ipsum</span><br>
<span>sit dolor</span><br>
<span>adipiscing elitur</span>
</p>
</div>
</li>
Obviously, when I load the page, the immage flex-1.jpg is not loaded because there is not the right path (infact using FireBug I obtain that it try to load the assets/img/flexslider/flex-1.jpg immage) so I think that I could use the absolute path but this is pretty orrible !!!
So I am thinking to use the get_template_directory_uri() function provided from WP to do this and I have try to change the previous code in this way:
<li>
<img src=<?php get_template_directory_uri().'/assets/img/flexslider/flex-1.jpg' ?>>
<div class="flex-caption">
<p class="flex-caption-text">
<span>Lorem ipsum</span><br>
<span>sit dolor</span><br>
<span>adipiscing elitur</span>
</p>
</div>
But don't work and using FireBug I can see that load nothing, infact in my brower source code I have:
<img src="">
Why don't work? What am I missing?
Tnx
Andrea
I hope it will work:
<img src="<?php echo get_template_directory_uri(); ?>/assets/img/flexslider/flex-1.jpg" />
If your assets folder inside theme.
please try :
<img src="<?php print(get_template_directory_uri()); ?>/assets/img/flexslider/flex-1.jpg" />
just check for slash, if double before "assests", remove static one.
You can also use:
<img src="<?php bloginfo('template_url'); ?>/images/yourimage.jpg">
I have been seriously been looking at this forever! I'm going out of my mind And can't figure out why my images are not displaying in my custom made footer.
I have firefox with firebug and it is simply saying that the url is failing to load. so I copy and pasted a url to an image that is currently working and is being shown via the background property in CSS just fine. (thats the top one that says dakota jones). copy and pasting the exact img src proves it still not to work.
my folder is images. My functions.php is right outside. the hierarchy is correct. what the heck?? The testing text in the p tags work just fine. uhuhuhu
Somebody help me! I'm using wp and genesis theme.
add_action('genesis_before_footer', 'include_sponsors');
function include_sponsors() { ?>
<div class="sponsors">
<p>This is testing text</p>
<img src="images/dakotajonesheader3.jpg" alt="Smiley face" height="42" width="42" />
<img src="images/tfobw.png" />
<img src="images/basskingbw.png" />
<img src="images/bighawgbw.png" />
<img src="images/kbw.png" />
<img src="images/mccoybw.png" />
<img src="images/nfcbwpng" />
<img src="images/rayjusbw.png" />
<img src="images/rrbw.png" />
</div>
<?php }
Use WordPress' inbuilt function:
<?php
bloginfo('template_directory'); ?>/images/dakotajonesheader3.jpg
?>
.. which will reference /wp-content/themes/your-theme/images/dakotajonesheader3.jpg
Wordpress dynamically rewrites URLs, so the URL you use to access a page is not the same as the path to the scripts that are running on the server. So you might request your page with example.com/Home. But your images are not stored in example.com/Home/images, which is where you're telling your browser to look. They're stored in example.com/wordpress/wp-content/themes/your_theme/images. So you have to give the absolute path to the images to the browser in your <img> tags.
Carson is correct, and you can use absolute paths to your images. Alternatively, if you want to avoid using absolute paths, you can call your images using bloginfo('template_directory');
For example:
<img src="<?php bloginfo('template_directory'); ?>/images/dakotajonesheader3.jpg" alt="Smiley face" height="42" width="42" />