Tutorials

loading...

Photo Galleries, Portfolios and Presentations

There are a few ways in which you can include photographs on your Yola website:

  1. Use the Gallery widget.
  2. You can use the Flickr widget.
  3. Incorporate a Flickr Search widget
 

The Gallery widget

The Gallery widget makes it easy to add a gallery to your website quickly and easily!  You do not need to add single photos into Picture widgets, then resize it, or use a third-party gallery from another source.

Here are the steps to follow to create your Gallery:

1. Go to Widgets.

2. On the drop-down menu, select Popular.

3. Drag and drop a Gallery widget onto your page.

User-added image

4. The File Manager will open up, allowing you to either browse through the existing files or upload a new image file by clicking Upload Files. You can also choose to Add Stock Images which gives you access to a Pixabay's gallery of stock images (available on Yola Silver and Yola Gold packages)​.

  • To upload multiple pictures into the File Manager at the same time: Hold down "ctrl" (for PC users) or the "cmd" key (for Mac users), while clicking on the pictures you would like to upload. Click Select in the bottom right corner to upload the images.

User-added image
 

5. Once the image file has been added to the File Manager, click on the picture file you want to use and click Select. The picture will be added to your gallery.

  • To add multiple images to your gallery: Hold down the left-mouse button and drag over the files you want to add OR hold down the shift key and select the files you want in the gallery. Click Select to add them to the Gallery widget.


6. To edit the layout, margins and hover text, click Edit in the top left-hand corner of the widget.

User-added image

In addition, there are a host of other widgets and clever tricks that you can use to embed images into your website.

Let's examine the Flickr Gallery and other widgets before going on to explore what we call the DIY approach - using our standard editing tools to create a "menu" page of thumbnails which then link to new pages with larger photos with caption information.

Then we'll look at how you can embed code from a few other useful online tools (a Flickr gallery, a Zoho presentation, and a ViewBook slideshow).

 

Flickr Galleries

There are a variety of widgets designed specifically for use with Flickr - just have a look at the multiple options that Google Gadgets has listed: Google search listing.

For this tutorial, we'll expand on the things we learned in the Exploring Images tutorial about our standard Flickr Search widget and our Flickr widget. In addition, we'll pass along a few tips on creating a slick Flickr Slideshow.
 

The Flickr Search widget

This widget (go to Widgets and select Media from the drop-down menu) pulls squared thumbnail images from your Flickr account or from the Flickr pool. Clicking on any of these images takes you out of your website to the relevant page within Flickr. See how it displays here (horizontally across the top): Zanzibar Adventure.

To allow the Flickr Search widget to access images from your own Flickr account, type in the email address that is affiliated with your Flickr account. Although this widget does not allow you to select specific images from your account to display on your Yola website, you can narrow down which ones will be chosen by using the "Search Phrase" box.

Remember that your images on Flickr will need to be publicly available to work on Yola.

 

Flickr widget

This widget (go to Widgets and select Media from the drop-down menu) dynamically creates beautiful photo galleries for you in seconds! It automatically generates thumbnail images and the larger click-throughs. You configure the Flickr Gallery Properties in much the same way as the simple Flickr Search. Type in your email address and Search Phrase and then refine how the results display on your page:

  • Results per page
  • Number of Columns
  • Image Size.

In this example, it's set to display 10 "Small Square" images in five columns. Once you're done, click Save and republish your site to see the changes.

Flickr

 

Flickr Slideshow

A good way in which you can embed a slideshow of a specific Set of Flickr photographs in your Yola website is to create and upload the images you wish to display to your Flickr account. 

Go to flickrslideshow.com. Enter your information.  The Flickr Slideshow generates a piece of code for you to embed into your website.

  1. Drag and drop an HTML widget (located in Widgets and selecting Popular from the drop-down menu) onto your page.
  2. Paste the code generated by the Flickr Slidr into the HTML Editor.
  3. Click Save.
  4. Republish your site to see the changes. 

 

Inserting a Presentation

There are a variety of online applications that cater to the creation of sophisticated slideshows, portfolios and presentations. Once you have the code needed, you can do the following: 

  1. Go to Widgets and select Popular from the drop-down menu.
  2. Drag and drop an HTML widget onto your page.
  3. Then paste paste the code into the HTML Editor and click Save.
  4. Republish your site to see the changes.


Please keep in mind that while the code may work now, we cannot guarantee that it will continue to work in the future. Codes can become obsolete and/or conflict with the enhancements made to provide you with the best Sitebuilder possible.
 

Related Tutorials

It's easy to take your business online with Yola.