I would like to add a download link in my Fancybox. I'm new in programming and I can't seem to figure out what code to use and where to put it. Thank you in advance.
I'm using FancyBox v3.2.10.
Here's the code:
<?php $directory = "images/"; ?>
<?php $dir = glob ($directory . "*.{jpg,png,gif,JPG}",GLOB_BRACE) ?>
<?php foreach ($dir as $key => $value): ?>
<div class="thumb">
<a href="<?php echo $value; ?>" data-fancybox="images" data-caption="<?php echo $value; ?>">
<img src="<?php echo $value; ?>" alt="" />
</a>
</div>
<?php endforeach; ?>
Try something like this -
$('[data-fancybox="images"]').fancybox({
buttons : [
'download',
'thumbs',
'close'
]
});
Demo - https://codepen.io/anon/pen/MXjGQB
Related
I am trying to display images on my web page, the content is getting fetched from my database, but the issue I'm facing is in displaying the image. please, can anyone guide me how should I display the image?
I mean to say the path what I should give
here 'image' is my column name and this is my view
<?php
if( !empty($results) ) {
foreach($results as $row) {?>
<div class="col-sm-4">
<img src="<?php echo base_url('uploads/');$image?>" alt="">
<h3><?php echo $row->title; ?></h3>
<p><?php echo $row->content; ?></p>
</div>
<?php
} ?>
<?php }
?>
Hope this will help you :
Use this : <img src="<?php echo base_url('uploads/'.$row->image);?>" alt="">
The whole code should be like this :
<?php
if( !empty($results) ) {
foreach($results as $row) {?>
<div class="col-sm-4">
<img src="<?php echo base_url('uploads/'.$row->image);?>" alt="">
<h3><?php echo $row->title; ?></h3>
<p><?php echo $row->content; ?></p>
</div>
<?php
} ?>
<?php }
?>
If $image is the column name(which contains image name) then Replace
<img src="<?php echo base_url('uploads/');$image?>" alt="">
with
<img src="<?php echo base_url();?>uploads/<?php echo $row->image;?>" alt="">
If $image has image path then remove ';' and add '.' on echo base_url('uploads/');$image?> line
You issue here is the following code;
<?php echo base_url('uploads/');$image?>
This is because you are not concatenating the string, rather, just saying it's variable name, so, use of the following will provide the output;
<?php echo base_url('uploads/') . $image' ?>
This replaces the semi-colon part way through for a period (.) which is the PHP concatenation operator
Obviously, there is the issue you are not setting $image, which would require (before usage) of;
$image = $row['image_column_name'];
// Or
$image = $row->img_column_name
Hello after I add some code to this PHP foreach the page goes blank and all I can see is a round black dot at the top left of screen.
My website is in Joomla3 and I am trying to customize a module. my site is http://get2gethersports.com
I have a recent post module that only shows the articles title.
that code is posted below
<?php if ($items) { ?>
<ul class="rsblog-recent-module unstyled<?php echo $params->get('moduleclass_sfx',''); ?>">
<?php foreach ($items as $item) { ?>
<li>
<a <?php echo $opener; ?> href="<?php echo JRoute::_('index.php?option=com_rsblog&view=post&id='.RSBlogHelper::sef($item->id,$item->alias).$Itemid,false); ?>">
<?php echo $item->title; ?>
</a>
</li>
<?php } ?>
</ul>
<?php } ?>
I would like to add an image abocve like the blog feed on http://vape-co.com
So I navigated to the component and saw the call for the image. which is posted below:
<div class="rsblog-entry-content">
<?php if ($this->item->image) { ?>
<div class="rsblog-entry-image">
<img class="rsblog-entry-thumb img-polaroid" src="<?php echo JURI::root().'components/com_rsblog/assets/images/blog/'.$this->item->image; ?>?nocache=<?php echo uniqid(''); ?>" alt="<?php echo $this->escape($this->item->title); ?>">
</div>
<?php } ?>
but whenever i add it or a snippet of it to the previous code it breaks....
Any ideas why it is breaking the page and how to fix it?
I tried adding in new li tags. Just adding the PHP part above the a link etc...
CODE UPDATE----
<?php if ($items) { ?>
<ul class="rsblog-recent-module unstyled<?php echo $params->get('moduleclass_sfx',''); ?>">
<?php foreach ($items as $item) { var_dump($item);?>
<li>
<div class="rsblog-entry-content">
<?php if ($this->item->image) { ?>
<div class="rsblog-entry-image">
<img class="rsblog-entry-thumb img-polaroid" src="<?php echo JURI::root().'components/com_rsblog/assets/images/blog/'.$this->item->image; ?>?nocache=<?php echo uniqid(''); ?>" alt="<?php echo $this->escape($this->item->title); ?>">
</div>
</div>
<?php } ?>
<a <?php echo $opener; ?> href="<?php echo JRoute::_('index.php?option=com_rsblog&view=post&id='.RSBlogHelper::sef($item->id,$item->alias).$Itemid,false); ?>">
<?php echo $item->title; ?>
</a>
</li>
<?php } ?>
</ul>
<?php } ?>
Try $item->image instead of $this->item->image
Correct code. Looks like it just needed some reduction.
<?php if ($items) { ?>
<ul class="rsblog-recent-module unstyled<?php echo $params -> get('moduleclass_sfx',''); ?>">
<?php foreach ($items as $item) { ?>
<li>
<?php if($item->image != '') ?>
<img src="components/com_rsblog/assets/images/blog/<?php echo $item->image;?>" alt="<?php echo $item->title. "logo";?>" width="100px"/>
<br/>
<a <?php echo $opener; ?> href="<?php echo JRoute::_('index.php?option=com_rsblog&view=post&id='.RSBlogHelper::sef($item->id,$item->alias).$Itemid,false); ?>">
<?php echo $item->title; ?>
</a>
</li>
<?php } ?>
</ul>
<?php } ?>
so i guess this is pretty easy for most of you, but i can't figure this out.
im trying to make the links dynamic eg: href="linkname(#1 or #2 etc)"
any ideas?
<?php if ($top_fundraisers && is_array($top_fundraisers)): ?>
<?php foreach ($top_fundraisers as $index => $fundraiser): ?>
<a title="" class="fancybox" href="linkname(GENERATE CODE HERE)">
<div class="top-fundraiser">
<div id="newo<?php print htmlentities($index + 1); ?>" class="top-fundraiser-image">
<img src="<?php
if($fundraiser['member_pic_medium']) {
print htmlentities($fundraiser['member_pic_medium']);
} else {
print $template_dir . '/images/portrait_placeholder.png';
}
?>"/>
</div>
</div>
</a>
<?php endforeach;?>
<?php endif; ?>
Suppose below is what you need.
<?php if ($top_fundraisers && is_array($top_fundraisers)): ?>
<?php foreach ($top_fundraisers as $index => $fundraiser): ?>
<a title="" class="fancybox" href="linkname(#<?php echo $index + 1; ?>)">
<div class="top-fundraiser">
<div id="newo<?php print htmlentities($index + 1); ?>" class="top-fundraiser-image">
<img src="<?php
if($fundraiser['member_pic_medium']) {
print htmlentities($fundraiser['member_pic_medium']);
} else {
print $template_dir . '/images/portrait_placeholder.png';
}
?>"/>
</div>
</div>
</a>
<?php endforeach;?>
<?php endif; ?>
Im using this to display a list of thumnails called from my cms:
<?php if($gallery_images) { ?>
<?php
$slide_page = 1;
foreach($gallery_images as $count => $image) { ?>
<li><a href="<?php echo $image->getResizedImage(); ?>" rel="example1" title="********"><img width="125" height="80" src="<?php echo $image->getThumbnailImage()
?>" /></a></li>
<?php if(($count+1) % 3 == 0) {
$slide_page += 1;
?>
It calls images from within my CMS and displays them in groups of 3, with some added jquery to scroll through the sets.
What im trying to do is merge this with my videos within the same list.
The video code is as follows:
<?php foreach($videos as $count => $video) { ?>
<img src="{thumbnail}" />Video A
<?php } ?>
Ive tried using the array_merge function but seem to be having difficulties any help would be greatly appreciated
It's easy:
foreach (array_merge($gallery_images, $videos) as $count => $value) { }
You may also want to look at array_chunk().
Update:
<? foreach (array_merge($images, $videos) as $key => $value): ?>
<? if (is_object($value) === true): ?>
<? if (method_exists($value, 'getLocation') === true): ?>
<img src="{thumbnail}" />Video A
<? elseif (method_exists($value, 'getResizedImage') === true): ?>
<img width="125" height="80" src="<?= $image->getThumbnailImage(); ?>" />
<? endif; ?>
<? endif; ?>
<? endforeach; ?>
Overview
I am trying to get a photo feed on to my site using Flickr's api and the phpflickr library. I can successfully get the photoset on to my site, but it shows all the photos from every photoset, what I was hoping to achieve was to show the primary photo from each photoset, and then if the user clicked on the image it would show the full photoset in a lightbox/shadowbox.
My Code
<div id="images" class="tabnav">
<ul class="items">
<?php $count = 1; ?>
<?php foreach ($photosets['photoset'] as $ph_set): ?>
<?php $parentID = $ph_set['parent']; ?>
<?php $photoset_id = $ph_set['id'];
$photos = $f->photosets_getPhotos($photoset_id);
foreach ($photos['photoset']['photo'] as $photo): ?>
<li>
<a rel="shadowbox['<?=$count;?>']" href="<?= $f->buildPhotoURL($photo, 'medium') ?>" title="<?= $photo['title'] ?>">
<img src="<?= $f->buildPhotoURL($photo, 'rectangle') ?>" alt="<?= $photo['title'] ?>" width="210" height="160" title="<?= $photo['title'] ?>" />
<h3><?=$ph_set['title']?></h3>
<p><?=$ph_set['description'];?></p>
</a>
</li>
<?php endforeach; ?>
<?php $count++; ?>
<?php endforeach; ?>
</ul>
</div>
Another Attempt
I have also tried calling the getPhotos function differently, instead of sending it without any parameters I sent it with parameters
$photos = $f->photosets_getPhotos($photoset_id, NULL, NULL, 1, NULL);
The above code stopped the showing all the photos from each photoset and started showing just the primary image, but it also stopped making the rest of the photos accesible to me.
Is there something I can do to make this work? I am totally out iof ideas.
Regards and thanks
I came up with this soltion, thought I would post it in case anyone else hits this problem,
<?php $count = 1; ?>
<?php foreach ($photosets['photoset'] as $ph_set): ?>
<?php $parentID = $ph_set['parent']; ?>
<li>
<?php $photoset_id = $ph_set['id'];
$photos = $f->photosets_getPhotos($photoset_id);
foreach ($photos['photoset']['photo'] as $photo): ?>
<?php if($parentID == $ph_set['parent']): ?>
<a rel="lightbox[album<?=$count;?>]" href="<?= $f->buildPhotoURL($photo, 'medium') ?>" title="<?= $photo['title'] ?>">
<?php endif;?>
<img src="<?= $f->buildPhotoURL($photo, 'rectangle') ?>" alt="<?= $photo['title'] ?>" width="210" height="160" title="<?= $photo['title'] ?>" />
<h3><?=$ph_set['title']?></h3>
<?php if($ph_set['description'] != null) :?>
<p><?=$ph_set['description'];?></p>
<?php endif; ?>
<?php if($parentID == $ph_set['parent']): ?>
</a>
<?php endif;?>
<?php endforeach; ?>
</li>
<?php $count++; ?>
What you'll probably want to do is starting by iterating through the whole array and grouping each album into a separate array first and making a special array for your album's main photo.
Then you can easily iterate through the arrays to display each album and the code becomes much more maintainable.