Building My “Boxed” Demo Site – Part 2 Photo Galleries and Slideshow

Adding Image Galleries with the FooGallery Plugin

I wanted the homepage of my “Boxed” demo website to consist of a grid of images, each of which was linked to one of the gallery pages that I had created earlier (see my previous blog post “Building My “Boxed” Demo Site – Part 1“). I used the free FooGallery plugin to make a gallery containing these images, and chose to use a Masonry Image Gallery with the following settings:

  • Thumb width = 200
  • Masonry Layout = 3 columns
  • Gutter Size = Normal
  • Thumbnail Link = Custom URL

Read moreBuilding My “Boxed” Demo Site – Part 2 Photo Galleries and Slideshow

Building My “Boxed” Demo Site – Part 1

Boxed is one of a handful of WordPress websites that I’ve set up to demonstrate some of the different formats that can be achieved using my favourite WordPress theme, GeneratePress with its Premium modules.

Please note that this is an affiliate link, as described on my Privacy and Cookie Notice page. I am happy to recommend GeneratePress and you can find out why it’s my favourite theme by reading my blog post “Flexible, Customisable WordPress Themes“.

The Boxed site demonstrates the following:

  • colours and fonts set using GeneratePress Premium’s customiser options
  • the “separate containers” layout
  • different backgrounds for the body and content areas of the site
  • blog posts with a masonry grid layout
  • a navigation menu on the side of the page.

The layout of the site is inspired by the “Sider” GeneratePress site which uses CSS code to move the navigation menu to the side. The easiest and quickest way for you to build this kind of website from scratch might be to install Sider as a starting point. However, for this exercise, I chose to use some of Sider’s code in my site’s additional CSS area, as I will describe later in this post.

  • This first article explains how I set up and customised the website and then added code copied from the “Sider” site to move the navigation menu.
  • Part two will be about using the FooGallery and Smart Slider 3 plugins to add galleries and a slideshow.

Read moreBuilding My “Boxed” Demo Site – Part 1

Adding a Row of Image Links with the WordPress Block Editor

Some time ago, I wrote a blog post giving instructions for adding a row of image links to a WordPress website. The methods I described should still work, but now that the new WordPress block editor (a.k.a. “Gutenberg”) has been released, I would expect it to be easier to carry out this task without using the plugins I had looked at before.

I thought I’d write a new post to give an update in the light of the changes, and this accidentally turned into a mini review of some third party blocks plugins.

WARNING: Sticking with the standard WordPress Columns block (as described in the next section) should be fine, but it’s been brought to my attention that, until a fix is found, it’s risky to use third party container or layout blocks as if you disable the plugin, the contents of the block could be lost. Note that I’m not talking about individual blocks here, such as advanced image blocks. This problem is related to row / column / container / layout blocks which contain other blocks within them.

Read moreAdding a Row of Image Links with the WordPress Block Editor

Creating a Mood Board with Milanote

Recently, I came across milanote.com which seemed to be a good tool for creating a mood board or style guide.

When planning a website, or other creative project, it can be really helpful to build a mood board so that you can visualise how certain colours, fonts, images etc might work together. A style guide can act as a useful reference to ensure that you, and others involved in the project, are consistent in your use of various design elements.

Read moreCreating a Mood Board with Milanote

Flexible, Customisable WordPress Themes

There are a couple of different approaches to choosing a WordPress theme:
1. Try to find a theme that looks just how you want it straight out of the box (or with a few small tweaks). Then just add your own text and images
2. Choose a plain looking, but flexible, theme as a starting point and customise it to look just as you want it to.

I favour the 2nd approach, but that doesn’t mean it’s right for everyone.

Read moreFlexible, Customisable WordPress Themes

Self-hosted WordPress Versus the Rest

WordPress have an old article (The $64,000 Question: WordPress.com or WordPress.org?) with an analogy that I’m going to borrow. The original article was written in 2013, although I see that it has been updated to mention the WordPress.com Business Plan (more on that below). I’ll extend the analogy a bit and throw in some things that weren’t mentioned.

The idea is that self-hosted WordPress versus WordPress.com is a bit like buying a house versus renting one.  I like this comparision and would extend it to include other platforms such as Squarespace, Weebly and Wix.

Read moreSelf-hosted WordPress Versus the Rest

Instructions for Adding a Row of Image Links

UPDATE – Please note that this article was written before the release of the new WordPress block editor (a.k.a. “Gutenberg”). For a more up-to-date approach, see my article: Adding a Row of Image Links with the WordPress Block Editor.

It’s quite common to want a page layout like the example below, with a row of three images, each of which links to a different page of the website (nails, make up and hair, in my example).

Read moreInstructions for Adding a Row of Image Links

Alternatives to WordPress Page Builders

UPDATE: This article was written before the release of the WordPress block editor (a.k.a. Gutenberg).

Page Builders have become so popular that sometimes new WordPress users get the impression that they are expected to use one. My own view is that it’s best to keep things simple and use a page builder only if you have a need for it.

Read moreAlternatives to WordPress Page Builders