Customize gallery's layout

You have full access to the HTML of your gallery, making it easy to customize every aspect of it.

Galleries

Each gallery can be fully customized.

  1. Open Galleries > Galleries tab.
  2. Click on a gallery name from the list.
  3. Click Customize gallery button.
  4. At this point, you can quickly and easily customize every facet of your gallery.
  5. To edit gallery caption or HTML, click Edit HTML/CSS button.

Product galleries

Product gallery can be placed only in webstore product page, think of it as part of your product page. Hence you need to customize gallery design and layout once for all product pages.

  1. Open Galleries > Product galleries tab.
  2. Click Customize button.
  3. At this point, you can quickly and easily customize every facet of your gallery.
  4. To edit gallery caption or HTML, click Edit HTML/CSS button.

Template engine & variables

Socialphotos use simple Liquid templating language that makes it easy to customize every aspect of your widget. Liquid is both powerful and quick to learn. Read more: Liquid for Designers.

These variables can be used in your Widget template

hashtag_listThe variable "hashtag_list" refers to assigned hashtags in gallery.
userThe variable "user" refers to the Social Photos user. Has the following attributes: user.instagram
thumbnails_block The variable "thumbnails_block" refers to the place where thumbnails template will be generated.
settingsThe variable "settings" refers to the widget appearance and settings. Has the following attributes: settings.font_size, settings.text_color, settings.link_color, settings.tag_bg_color, settings.widget_width.
uploadThe variable "upload" refers to the widget upload function and renders button. By pressing it upload modals opens for user to submit photo through your website.

These variables can be used in your Thumbnails template

thumbnailsThe variable "thumbnails" refers to the thumbnails. Has the following attributes: thumbnails.image, thumbnails.link, thumbnails.username.