Photo galleries, portfolios and presentations

Note: This article refers to the legacy version of the Website Builder. If you signed up to the HostPapa Website Builder after March 11 2020, you’re on the new version of the Website Builder. For help, go here.

There are a few ways in which you can include photographs on your HostPapa Website Builder website:

For instructions on how to add images to your website using the Picture Gallery Widget, click here.

Flickr Galleries
There are a variety of widgets designed specifically for use with Flickr. For information on how to use Flickr Galleries, refer to this article.

The Flickr Search Widget
This widget (located in the Media folder) 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 HostPapa Website Builder 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 HostPapa Website Builder.

flickr4

Flickr Gallery
This widget (Widgets > Media) automatically generates thumbnail images and 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.

flickr5

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

Go to www.flickrslidr.com. Type in your Flickr ID, plus Tags and hit the Create slideshow button. The FlickrSlidr generates a piece of code for you to embed into your website.

  1. Drag the HTML Code Widget (located in Widgets > Popular) 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.

In this example the code was adapted to include a Flickr User ID and Set ID (the numerical URL value that Flickr generates for a particular Set of photos). The User ID is your personal Flickr ID (your name or a numerical value depending on how you’ve set up your account), and the Set ID (a long number).

Inserting a Presentation
There are a variety of online applications that cater to the creation of sophisticated slideshows, portfolios and presentations.Zoho Show and ViewBook are two of the many options available.

Zoho Show
You’ll have to sign up to Zoho to use their services (it’s free for personal use). Log in and click on Zoho Show, their Online Presentation tool (Please note: Zoho has a very powerful offering of MS Office style applications). In this example, we’ve created blank slides and inserted images into pages using the Picture button (found on the Text Editing Toolbar). You can either use images from your Zoho library, Picasa or Flickr.

You can search and use Public Images from both Picasa and Flickr, or you can configure your account to grab images from your Picasa and Flickr accounts.

To embed your new Zoho presentation in your website:

    1. Click on Publish and then on Embed in Website/Blog.
    2. An HTML snippet will be displayed.
    3. Copy the code provided.
    4. Back on your site, drag and drop the HTML Code Widget onto your page.
    5. Then paste paste the code into the HTML Editor and click Save.
    6. Republish your site to see the changes.

Viewbook
Simply create an account, a new Presentation and start uploading your images.

To display your ViewBook presentation:

  1. In Viewbook, click on Share > Embedding.
  2. Copy the HTML code provided.
  3. Then, on your site, drag and drop the HTML Code Widget onto your page.
  4. Paste the code into the HTML Editor. You can alter the dimensions by changing the slidez_width and slidez_height values.
  5. Click Save.
  6. Republish your site to see the changes.

Related Articles