Hi i am trying to get an image to display when a result is picked from a data base this is my code below:
$box .= '<div style="margin-top:10px;height:120px;"id=\"Video\">
<br/>
<div style="border-style:solid;border-width:1px;border-color:#00000;width:400px;float:right;"id=\"Title\">'.$row['title'].'</div>
<div style="width:220px;height:150px;float:left;border-style:solid;border-width:1px;border-color:#000000;" id=\"VideoImage\">"
<img class="partimg1" src="classroom/images/'.$row['media_id'].'.jpg" /></div>
<div style="height:50px;width:400px;float:right;padding:2px;margin-bottom:5px;" id=\"Blurb\">'.$row['blurb'].'</div>
<div style="height:21px;width:152px;margin-top:45px;margin-left:7px;background:url(images/bg_top_img2-09.jpg) repeat-x;color:#ffffff;padding-left:2px;float:left;border:1px solid #000000;position:relative;border-radius:15px;text-align:center;" id=\"Downloads\"> Download </div>
</div>';
the line with in the middle is where the image should be the .$row['media_id']. this will be a value from the database it will only be a number so for example 1 up to 50 and in the images folder the images are named 1 to 50 and they are all JPG is there something that i have missed because i have used this before and it worked.
all that displays on the screen is a broken image link like when the web page cannot find the image in the folder.
any help would be much appreciated.
You break the src link.
src=\"classroom/images/'.$row['media_id'].'.jpg\"/>
As you use simple quote ' for string delimiter, you don't need to escape double ones "
<img class=\"partimg1\" src=\"classroom/images/"'.$row['media_id'].'".jpg\"/>
Should be
<img class="partimg1" src="classroom/images/'.$row['media_id'].'.jpg" />
You also need to fix all your id attributes
Related
With the code here, it gives random pictures to the subjects, I want to make that picture a single picture, what should I replace this code with?
<div class="forum-symbol" role="img" aria-label="{$forum['name']}" style="background-image: url('{$forum['v7_modern_asset_url']}/images/forum/{$forum['fid']}.png')">
what should i replace this code with
I think this is inside a loop
you need to give the image URL an absolute path
eg.
<div class="forum-symbol" role="img" aria-label="{$forum['name']}" style="background-image: url('/folder/image-name.png')">
I hope this helps
First time here and hoping someone can help me. Apologies if I've done anything wrong with regards to posting this question here...
I've created a slide show (using PHP) based on 8 images loaded from an SQL database (PHPMyAdmin)
I want to be able to click on any one image to open a new page which will then show a larger version of the same.
I've scoured the internet and various other forums but struggling to find any help.
Please let me know if you require any further information prior to providing an answer. Any help will be hugely appreciated.
<div class="mySlides">
<div class="numbertext"><?php echo $i . " / 8" ?></div>
<a href="http://stu10.lccwebtest.co.uk/getimage.php">
<img src="<?php echo $product["Product_Image"];?>" style="width:100%">
</div>
My suggestion would be to end the anchor tag after the image (so the image is part of the link), set it's target attribute to _blank (so it opens in a new page), and finally pass some reference to getimage.php (so it can load the larger image). For example:
<div class="mySlides">
<div class="numbertext"><?php echo $i . " / 8" ?></div>
<a href="http://stu10.lccwebtest.co.uk/getimage.php?id=<?php echo $product["ID"];?>" target="_blank">
<img src="<?php echo $product["Product_Image"];?>" style="width:100%">
</a>
</div>
I've made an assumption on what your primary key is for "products", replace "ID" in my example above with the correct primary key.
Based on further discussion we established that getimage.php has no other function other than to show the larger image. So in that case how about doing away with it and adding the larger image url directly to the anchor as in the below:
<div class="mySlides">
<div class="numbertext"><?php echo $i . " / 8" ?></div>
<?php $largerImageUrl = $product["Product_Image"]; //replace the code here with your actual larger image url for this slide ?>
<a href="<?php echo $largerImageUrl;?>" target="_blank">
<img src="<?php echo $product["Product_Image"];?>" style="width:100%">
</a>
</div>
That reduces a lot of extra work. The only times you'd need a script in the middle would be if the larger image location was a secret or you wanted to somehow record the number of times it was viewed or you wanted to display some other html around the image. In other words, if it had some other function.
In my project's homepage there must be some images, these must link to other pages. Now, I want to manage these links in an automatic way using PHP. The only idea I came up with is to make a form and insert the images into some buttons and make their background invisible.
<div class="container">
<div class="row">
<div class="col-md-4">
<h3>FRESH ALBUMS</h3>
</div>
</div>
<div id="myline"></div>
<div class="row">
<div class="col-md-3">
<img src="contentimg/abbeyroad.jpg" height="200px" width="200px">
<div class="caption">
<h4>Beatles</h4>
</div>
<p> test</p>
</div>
<div class="col-md-3">TEST2</div>
<div class="col-md-3">TEST3</div>
<div class="col-md-3">TEST4</div>
</div>
</div>
This is the HTML at the moment. I just want to know if there are better ideas, options and if it will stay responsive. Thanks in advance.
I do not understand exactly what you are asking, but I cannot leave comments so I will try to answer what I think you are asking.
For the HTML part, you don't need a form with buttons, you can make hyperlinks out of the images instead, and the PHP can get the images to match the hyperlinks when it sends the page to your users browser. The PHP code would look like:
echo "
<a href='".$newPageLink."'>
<img src='".$imageLocation."' width='100px' height='100px'>
</a>";
Where $newPageLink is a variable in your PHP script that holds the path information for your hyperlink, and $imageLocation is the path information for where the image is stored.
All you need is a foreach or while loop to go through all of the images that you want on the page and also all of the pages that each image should link to. If it is always a manageable and unchanging list, you could store the values in an array in your script. For larger lists, or lists that are dynamic/always changing you might need to use a MySQL database table to store the image and hyperlink information.
I am trying to echo in php the image description in the data-caption of the clearing image gallery of Foundation3 but it is not working. Here is my code:
<li class="clearing-feature">
<a href="administration/galleri/kcfinder/upload/images/Galleri1/1.jpg">
<img data-caption="<?php echo $myDataBild1 ?>;" src="kcfinder/upload/images/Galleri1/1.jpg"></a>
</li>
This is not working. The image gallery is still working correctly but the caption in this picture is not showing. How can I correct this?
NOTE: The php $myDataBild1 is a txt file with text inserted via CKEditor and it is working just fine. Let me know if you need the code and the variable is shown if I echo it anywhere else.
Misplaced comma - also try by using addslashes.
<img data-caption="<?php echo addslashes($myDataBild1); ?>" src="kcfinder/upload/images/Galleri1/1.jpg"></a>
I was wondering...if any coding expert out there could spare a few minutes to help me out with a tiny problem? It's something to do with the alt image text.
You see, whenever I upload an image, the alt text for it doesn't display properly. You can have a look here --> http://buywerewolfcostume.com/. This is how it's displaying in the source code:
alt="Female-vampire-small.jpg"
alt="side_farm_trap_1.jpg"
How do I get it to display like this -
alt="Female Vampire" and alt="Side Farm Trap"
I tried installing a special Alt image plugin, (the site is built on a Wordpress platform) but that didn't work. I also tried editing the image settings but that didn't work either. Is there a special line of code I should add to the CSS stylesheet?
Btw, here is the image code in my stylesheet:
.images img {padding:0 13px 0 0;}
.images img.last {padding-right:0;}
I'd really appreciate it if anyone out there could please offer some advice...
in your index file where is says
<div class="images" style="padding-top:10px; "><?php get_images(); ?></div>
You might as well just replace with your images and then you can make the alt tags what ever you want.
<div class="images" style="padding-top: 10px;">
<img alt="Female Vampire" src="http://buywerewolfcostume.com/wp-content/uploads/Female-vampire-small.jpg">
<img class="last" alt="Side Farm Trap" src="http://buywerewolfcostume.com/wp-content/uploads/side_farm_trap_1.jpg">
</div>
This is a simple matter in html:
<img src="side_farm_trap_1.jpg" alt="Side Farm Trap" >
Edit after retagging: Does Wordpress hide the option to add alt text or a title to images?
Not sure I totally follow, but does this work for you?
<img src="Female-vampire-small.jpg" alt="Female Vampire" title="Female Vampire" />
The Alt tag is for when the image is for some reason NOT there. The alt text will show up in it's place
The Title tag is displayed as a tooltip in the browser
Note: IE used to display the Alt tag as a tooltip as well, but it no longer does.
When you upload an image via WordPress, put the text you want to show up as 'alt text' both in the "Title" field and in the "Alternative Text" fields. Then click the "Insert Into Post" button.
Here's a video about uploading an image via the WordPress interface. In this video the "alternative text" field is called "caption". In newer versions of WordPress, "caption" and "alternative text" are separated out into different fields. The "caption" field shows up as a caption underneath your image; the 'alternative text' (or 'title') field is what shows up on hover/mouseover. Experiment to see what works best for you.
http://wordpress.tv/2009/01/05/embedding-photos-video-audio-into-your-posts/
Best of luck!