![]() You can embed a LightGallery album in an iframe into your web page via the jAlbum embedded template: select in jAlbum menu item Album / Embed Album and copy the code to your webpage, see this example page. This is not required if you embed a LightGallery gallery via an iframe into your web page. ![]() Notice that in this implementation the album code and the rest of the website code should be saved in the same html page. I used this code and procedure for my own home page You can also embed a LightGallery thumbnails page into your web page, see this example page. If required, edit in common.css the css code for the container, for example: Upload your web-page folder to your server with an FTP-program like FileZilla. To the place in the body section where you like to see the embedded light-box.Ĭopy just above the statement the code from the end of the album index file: Copy only the lines you see in your album index file. The last two type of statements may be different for your album or they may be absent. In the head section copy after your style-sheet statements these type of lines from the album index file: Edit the index.html file of your webpage: add code from the album index file, Make the album and move the sub-directories slides, thumbs and res and file slidePage.js to your webpage folder. Make a file 'page-header_embed.inc' the image directory with only only one line of code: ![]() This will remove most unused code from the album index page. Start making a minimal album in a sibling directory of your web-page: Check both check-marks 'Skip thumbnails pages' and 'Use LightGallery-placeholder' and un-check slide Page options ' Show location button' and 'Show Share window button'. If the index file of your website is large, the method described above might not be very practical and you can better edit your original index page of your web-page manually. Use an FTP-program like FileZilla, to up-load the sub-directories slides, thumbs and res and files slidePage.js and index.html. If the you like to embed a light-box in the root of your website you should not use jAlbum to upload the index page of your web-root, because it will start uploading all the files in your web-root. It is obliged to insert in the html code LightGallery container Īt the place you like to see the album with the images. The extra required html code is in include file 'page-header_embed.inc' in the image directory: The extra required css code is entered in the css textbox on the LightGallery 'Web page' settings tab: Rewrite to typescript Remove lightgallery.js and plugins imports and. No JSON data is used and no iframe is used as a container for a the album, it is all done in the excellent lightGallery library. Learn more about react-lightgallery: package health score, popularity, security. Use double click to zoom/unzoom the image. The middle button is used to start/stop the slide show and the right button can be used maximize the lightbox. Click on the Thumbnails button in the tool-bar in the upper right corner to show/hide the caption and the thumbnails below the slide image. ![]()
0 Comments
Leave a Reply. |