Jump to content

Search the Community

Showing results for tags 'lightbox'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Welcome to ProcessWire
    • News & Announcements
    • Showcase
    • Wishlist & Roadmap
  • Community Support
    • Getting Started
    • Tutorials
    • FAQs
    • General Support
    • API & Templates
    • Modules/Plugins
    • Themes and Profiles
    • Multi-Language Support
    • Security
    • Jobs
  • Off Topic
    • Pub
    • Dev Talk

Product Groups

  • Form Builder
  • ProFields
  • ProCache
  • ProMailer
  • Login Register Pro
  • ProDrafts
  • ListerPro
  • ProDevTools
  • Likes
  • Custom Development

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL







Found 9 results

  1. Hej, A module which helps including Photoswipe and brings some modules for rendering gallery markup. Feedback highly appreciated (Also pull requests are appreciated ? - have a new Job now and don't work a lot with ProcessWire anymore, yet, feel free to contact me here or on GitHub, Im'm still "online"!) Modules directory: http://modules.processwire.com/modules/markup-processwire-photoswipe .zip download: https://github.com/blynx/MarkupProcesswirePhotoswipe/archive/master.zip You can add a photoswipe enabled thumbnail gallery / lightbox to your site like this. Just pass an image field to the renderGallery method: <?php $pwpswp = $modules->get('Pwpswp'); echo $pwpswp->renderGallery($page->nicePictures); Options are provided like so: <?php $galleryOptions = [ 'imageResizerOptions' => [ 'size' => '500x500' 'quality' => 70, 'upscaling' => false, 'cropping' => false ], 'loresResizerOptions' => [ 'size' => '500x500' 'quality' => 20, 'upscaling' => false, 'cropping' => false ], 'pswpOptions' => (object) [ 'shareEl' => false, 'indexIndicatorSep' => ' von ', 'closeOnScroll' => false ] ]; echo $pswp->renderGallery($page->images, $galleryOptions); More info about all that is in the readme: https://github.com/blynx/MarkupProcesswirePhotoswipe What do you think? Any ideas, bugs, critique, requests? cheers Steffen
  2. EDIT: What I'm actually really looking for is a way to edit and add children of a page in a similar way as RepeaterMatrix fields: Easy to add new ones and easy to move, hide and modify inline: –––– I have a problem and am so close to a solution, but everything i've found so far only gets me about 95% and before I create something on my own want to ask is anyone knows a soltion or if I miss something. My simple requirement: Editing Children and creating new ones inside the current parent page context – eighter inline or in a Lightbox. Not working Option A: With page relation fields I can create new pages – but it requires me to select a fixed parent. If I don't provide a parent, no new link is present. Not working Option B: With the awesome AdminPageFieldEditLinks Module I can create new Pages directly without the need to provide a parant beforehand – but then I need to select it at runtime. There is a new link now – the link is: parent_id=0&amp;template_id=51&amp;modal=1 … if it only provided the correct parent_id!!! But now i have to select the parent: Not working Option C : That's what I do right now… Reordering the Child-Field to the first tab – but to maintain the context, I would need the edit and new button to open a lightbox instead of a page reload. Possible solutions: For A+B: If I could provide a selector as parent, this would solve my issue: "parent=page.id" or a checkbox "use parent page for new pages". Or I could use some hook? For C : I could write my own javascript to open the links in a Lightbox.
  3. Hello, Is there a module of way to have the images that are added in the body (field) to popup when clicked on? I have made a fotogallery and implemented this as a function. But have no clue how to do this the other images. Sanne
  4. Hi, I have been googling around like crazy to find a suitable very light-weight javascript library for showing a simple image gallery with one bigger main picture (just on the page, not in a lightbox), with clickable thumbnails that will show the selected image in a bigger version in the main image area when clicked. See the attached screenshot for an example! Most libraries out there seem to focus on fancy transitions, lightbox style image viewing, or don't include the thumbnail feature (just showing these dots, for selecting pictures) ... and so I haven't so far found what I'm looking for. Any hints? (Again, preferrably something super-lightweight, that is super-easy to integrate with pw).
  5. Hi everyone, I know the answer is right in front of me, but I've searched it for days already. I guess I'm still a beginner... please help me! I'm using the multi-language site profile, suggested in the installation of processwire, if that helps. I want to apply the fancybox only to the images of one template. Fancybox is already running, I put the necessary code in the _main.php file. <link rel="stylesheet" href="<?php echo $config->urls->templates?>scripts/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" /> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>scripts/fancybox/source/jquery.fancybox.pack.js"></script> <script type="text/javascript"> $(document).ready(function() { $(".gallery").fancybox({ }); });</script> Therefore I created a new template php called "gallery.php" and put that code inside. foreach($page->images as $image) { $thumbnail = $image->size(150,100); echo "<a class='gallery' rel='gallery-1' href='{$image->url}' title ='{$thumbnail->description}'><img src='{$thumbnail->url}' style=' padding: 5px;' ></a>"; } Now it shows the kind of gallery I want to have, but at the wrong possition of the site. I just don't know what I have to write in there to change the position. perhaps it is something like $content =... , but I already tried every combination I could think of and I've looked at all the tutorials I could find. I'm thankfull for any help, Leo
  6. We are currently building a website and have added PrettyPhoto onto our product pages. It works fine on all browsers except Firefox where it doesn't appear correctly, and it won't work on the iPad. We've got it working fine on other non ProcessWire websites on all browsers and devices so it may be something to do with the way the images are called using PHP. Can anybody suggest anything to resolve this? The site is currently on the test address http://owltreeweb.solutions/carman/
  7. If my client has added more than 1 image to an image field (called "blog_images"), how could I 1. Output a grid of images on my webpage as cropped thumbnails. 2. Make them clickable so they display a lightbox such as http://fancyapps.com/fancybox/ Thanks
  8. Greetings Everyone, I'm working on a couple of sites that need some imaginative gallery ideas. I started browsing around to see some examples of creativity and discovered a new Lightbox concept from Todd Motto. Just thought I'd post about it here and see what people think. Here's the link: http://toddmotto.com/introducing-superbox-the-reimagined-lightbox-gallery/ Thanks, Matthew
  9. I've been putting together a simple lightbox gallery using prettyPhoto. I have this working but I only want one thumbnail to launch the gallery and at the moment I'm getting one thumbnail for each image. Apologies for my poor php skills, I know this is coming from the echo but don't know how to display <img> only for the first list item. Here's my code: <ul id="gallery1"> <?php foreach($page->images as $img) { $thumb = $page->thumbnail->size(220, 200); echo "<li><a href='{$img->url}' rel='prettyPhoto[gallery1]'><img src='{$thumb->url}' alt='{$thumb->description}' width='{$thumb->width}' height='{$thumb->height}' /></a></li>"; }?> </ul> And my original code: <ul id="gallery1"> <li><a href="assets/library/image01.jpg" rel="prettyPhoto[gallery1]"><img src="assets/library/thumb1.jpg"/></a></li> <li><a href="assets/library/image02.jpg" rel="prettyPhoto[gallery1]"></a></li> <li><a href="assets/library/image03.jpg" rel="prettyPhoto[gallery1]"></a></li> </ul> Any help would be greatly appreciated.
  • Create New...