I was trying to change the style of only a part of php. This is my codes;
if($fetch_array)
{
$foto_destination = $fetch_array['foto'];
echo "<img src = '$foto_destination' height='150px' width='150px'>";
}
else
{
?>
<div style= "position:absolute; left:350px; top:70px;">
<?php
echo "<img src = 'images/avatar_default.png' height='150px' width='150px'>";
?>
</div>
But, this php part is inside if. This is why i could not change it? I want to display the image where i define it inside the div tag if the statement of "if" is true. How can i do this? Where am i missing?
Thanks
If I understand you correctly, it should be:
<?php
if($fetch_array){
?>
<div style= "position:absolute; left:350px; top:70px;">
<?php
$foto_destination = $fetch_array['foto'];
print " <img src = '$foto_destination' height='150px' width='150px'>";
}else{
?>
<div style= "position:absolute; left:350px; top:70px;">
<img src = 'images/avatar_default.png' height='150px' width='150px'>
<?php
}
?>
</div>
It shows the $foto_destination, if there is one.
HTH
Did you mean like this?
<?php
if($fetch_array) {
$photo = $fetch_array['foto'];
$styles = 'position:absolute; left:350px; top:70px;';
} else {
$photo = 'images/avatar_default.png';
$styles = 'position:absolute; left:350px; top:70px;';
}
?>
<div style="<?php echo $styles; ?>">
<img src="<?php echo $photo; ?>" height="150" width="150" />
</div>
That is correct or you can do an isset()
if (isset($fetch_array) {
...
The only advantage being that it will not error if the variable is undefined
Here's a more compact version, shorttags must be enabled.
<div style="position:absolute; left:350px; top:70px;">
<img src="<?= isset($fetch_array['foto']) ? "images/avatar_default.png" : $foto_destination['foto'] ?>" height="150px" width="150px" />
</div>
otherwise:
<div style="position:absolute; left:350px; top:70px;">
<img src="<?php echo isset($fetch_array['foto']) ? "images/avatar_default.png" : $foto_destination['foto'] ?>" height="150px" width="150px" />
</div>
Related
I try to print images with a for loop but the images dont load.
<?php
$imagenes = array('1.png', '2.jpg', '3.png', '4.jpg','IMG_0105.JPG');
?>
<div class="container">
<div class="row">
<div class="col-md">
<?php
for ($i=0; $i < 4; $i++) {
echo '<img src = \"$imagenes[$i]\" width = \'100px\' height = \'100px\';>';
}
?>
</div>
</div>
</div>
The images are in the same folder as the .php file
Edit: Added additional solutions based on answer from #nik
This will never work because variables are not evaluated inside of single quoted strings.
Make sure that your use a string inside double quotes. Or use string concatenation to build the HTML tag. Also, you image tag has a semicolon inside of it that might break the tag.
So you can do this ...
echo "<img src=\"{$imagenes[$i]}\" width=\"100px\" height=\"100px\">";
or
echo "<img src=\"" . $imagenes[$i] . "\" width=\"100px\" height=\"100px\">";
or
<img src="<?= $imagenes[$i]; ?>" width="100px" height="100px">
or
<img src="<?php echo $imagenes[$i]; ?>" width="100px" height="100px">
Use foreach for this. And for concatinate string with var - use . (dot)
<?php
foreach ($imagenes as $image) {
echo '<img src = "'.$image.'" width = "100px" height = "100px">';
}
?>
This would make it simplier:
<div class="container">
<div class="row">
<div class="col-md">
<?php foreach ($imagenes as $url) { ?>
<img src="<?php echo $url ?>" width="100px" height="100px">
<?php } ?>
</div>
</div>
</div>
I think its the way you're escaping the characters, you can just use concatenation on $images:
<div class="container">
<div class="row">
<div class="col-md">
<?php
for ($i=0; $i < 4; $i++) {
echo '<img src = '.$imagenes[$i].' width="100px" height ="100px";>';
}
?>
</div>
</div>
</div>
i use this template for my image slider "https://www.jssor.com/demos/image-gallery.slider"
i try to change a image if image1 is empty(NULL) to image2, there is my sample code i have try but doesnt work.
<div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:980px;height:550px;overflow:hidden;">
<?php
if (!empty ($upload_dir.$data['image1'])){
?>
<div>
<img data-u="image" src="<?php echo $upload_dir.$data['image1']; ?>" />
<img data-u="thumb" src="<?php echo $upload_dir.$data['image1']; ?>" />
</div>
<?php
}else{
?>
<div>
<img data-u="image" src="<?php echo $upload_dir.$data['image2']; ?>" />
<img data-u="thumb" src="<?php echo $upload_dir.$data['image2']; ?>" />
</div>
<?php
}
?>
this code is work when image1 is able on databases, but when it null the image is not change as image2
It's because your $upload_dir is not empty so $upload_dir.$data['image1'] would not be empty.
Try changing the condition to:
if (!empty($data['image1'])) {
...
}
I'm doing some changes on an online store that is running OpenCart 2.2.
When browsing below the categories on the left side, there are 2 carousels that show different promotions. I want to modify it that before the second carousel there is a description text. To do that I should edit the template file. And here is where I get lost..
This is the code in the template file:
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php foreach ($banners as $banner) { ?>
<div class="item">
<?php if ($banner['link']) { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
From I see in the browser inspector and in my case, this code generates 2 banners with the ids - "banner0" and "banner1". The description text should go at the top of the code (right before ). If I use a simple paragraph, it gets displayed twice - above each banner.. How should I change it so that it will display the paragraph only above the second banner (id - banner1)?
I was thinking about an if-else statement, but I'm not sure if that will work... Could anyone help out a bit? My knowledge in PHP isn't much... :S
Thanks in advance!
Best regards,
Tsvetko Krastev
Then you need to know that this is the second time round the foreach loop. So change the foreach to include the index like this, and add a test inside the loop for $i == 1
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php //foreach ($banners as $banner) {
foreach ($banners as $i => $banner) {
?>
<div class="item">
<?php if ($banner['link']) {
if ( $i == 1 ) {
echo 'YOUR HTML CONTAINING SOME TEXT HERE';
}
?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
If I get the code right, $module is 0/1 (if id's get values banner0 and banner1), then this should work:
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php foreach ($banners as $banner) { ?>
<?php if ($module == "1") { ?>
<p>Your description</p>
<?php } ?>
<div class="item">
<?php if ($banner['link']) { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
Thank you so very much guys!!! Tried both versions and they throw a error, but looking more carefully into the code and both your solutions, I came up with this:
<div id="desc<?php echo $module; ?>">
<?php if ($module == 1) { ?>
<p>Description</p>
<?php } ?>
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php foreach ($banners as $banner) { ?>
<div class="item">
<?php if ($banner['link']) { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
</div>
Thank you very much again for the quick responses and the help! :) :3
Best regards,
Tsvetko Krastev
I am trying to figure out how to change the photo without the page refreshing. I have seen some of the example but just cannot figure out how to implement it in to my working page.
This is what I have right now:
<div id="propertyDetailsImage">
<img class="image photo" src="<?php echo $property->photos->photo[$mainPhoto - 1]->url; ?>" width="<?php echo $property->mainPhotoWidth * 0.77 ?>" height="<?php echo $property->mainPhotoHeight * 0.77 ?>" alt="<?php echo $property->address->full; ?>"/>
</div>
<div class="photoPosition">
<?php
$previousPhoto = $mainPhoto - 1;
if($previousPhoto == 0) {
$previousPhoto = $property->totalPhotos;
}
$nextPhoto = $mainPhoto + 1;
if ($nextPhoto > $property->totalPhotos) {
$nextPhoto = intval(1);
}
?>
<img src="images/previous.png" alt="Previous photo" height="12" width="13" border="none"/>
<span id="photoPosition"><?php echo $mainPhoto; ?></span> of <?php echo $property>totalPhotos; ?>
<img src="images/next.png" alt="Next photo" height="12" width="13" border="none" />
</div>
</div>
<div class="col-md-6">
<div id="thumbnails">
<h3 class="additional">Photos</h3>
<?php
// Iterate throught the list of photos
foreach($property->photos->photo as $photo) {
?>
<script type="text/javascript">
addPhoto(
<?php echo $photo->id; ?>,
<?php echo $photo->width; ?>,
<?php echo $photo->height; ?>,
"<?php echo $photo->caption; ?>");
</script>
<img src="<?php echo $photo->url; ?>" width="<?php echo $photo->widthSmall; ?>" height="<?php echo $photo->heightSmall; ?>" class="image photo" id="photo<?php echo $photo->position; ?>" alt="Additional Photo of <?php echo $photo->address->advertising; ?>" onclick="return showPhoto(<?php echo $photo->position; ?>)" />
<?php }
?>
Any help is appreciated. Cheers
Dima
You should use ajax to get like this results.
you should go here,
The image slider shown in this demo is for free.
For detailed instructions, please visit online
http://www.menucool.com/slider/javascript-image-slider-demo1
I have box for dynamic images and desc slider using nivoslider. Now I have big problem -> my PHP code is:
<div id="slider" class="nivoSlider">
<?php
$featured = mysql_query("SELECT * FROM featured WHERE order > 0 ORDER BY order ASC");
$count_featured = mysql_num_rows($featured);
if ($count_featured < 1) { echo "error data" }
while ($swcms = mysql_fetch_assoc($featured)) { ?>
<img width="500" height="170" src="<?php echo "$swcms[image]"; ?>" title="#<?PHP echo "$swcms[id]"; ?>" alt="" border="" />
<div id="<?PHP echo "$swcms[id]"; ?>" class="nivo-html-caption"><?PHP echo "$swcms[desc]"; ?> </div>
<?php $c++; }?>
</div>
This Worked 100% But in firebug I see many GET undefined request after each slide:
I found the problem; nivoslider worked with this method for show images/desc (caption):
<div id="slider" class="nivoSlider">
<img src="..." title="#id" />
</div>
<div id="id" class="nivo-html-caption"></div>
And my PHP loop is:
<div id="slider" class="nivoSlider">
<img src="..." title="#id" />
<div id="id" class="nivo-html-caption"></div>
</div>
How do I fix this PHP code for nivoslider loop?
<div id="slider" class="nivoSlider">
<?php
$featured = mysql_query("SELECT * FROM featured WHERE order > 0 ORDER BY order ASC");
$count_featured = mysql_num_rows($featured);
$captions = '';
if ($count_featured < 1) { echo "error data" }
while ($swcms = mysql_fetch_assoc($featured)) { ?>
<img width="500" height="170" src="<?php echo "$swcms[image]"; ?>" title="#<?PHP echo "$swcms[id]"; ?>" alt="" border="" />
<?php $captions .= '<div id="' . $swcms[id] .'" class="nivo-html-caption"' . $swcms[desc] .'</div>'; ?>
<?php $c++; }?>
</div>
<?php echo $captions; ?>