Tutorial Videos

Learn to master website creation with these quick videos

30 articles in this collection
Written by Nick Raushenbush
The Basics

6-Min Quick Start to Shogun

This video will help you get started using Shogun. It goes over some of the basics around Boxes, Columns, Margins/Padding, and Mobile.
Written by Nick Raushenbush
Updated over a week ago

5-Min Guide to Margins and Padding

Margins create space between elements. Padding creates space within an element. Margins and Padding are super important.
Written by Nick Raushenbush
Updated over a week ago

How to use the Box Background element to style and structure page sections.

The Box Background element is used to structure page sections and create overlays with image and video backgrounds.
Written by Nick Raushenbush
Updated over a week ago

What Are Columns and How to Use Them

Columns allow you to put content side by side. If you want to create a split screen, use columns to create horizontal drop zones.
Written by Nick Raushenbush
Updated over a week ago

Responsiveness: Make Your Pages Great for Mobile

Learn responsive design and how to make your pages optimized across devices for mobile, tablet, desktop and widescreen.
Written by Nick Raushenbush
Updated over a week ago

How To Create A Standard Page in Shogun

This is how you can create a basic page in Shogun. Try this when you're getting started.
Written by Nick Raushenbush
Updated over a week ago

How To Make a Full Width Page

If you want to make a page full width, use a Box Background element and toggle the full width button, or use the landing page style layout.
Written by Nick Raushenbush
Updated over a week ago

How To Re-Use Content using Shogun's Snippets

Snippets are how you can easily re-use an element, section, or even an entire page. You can re-use Snippets across your pages.
Written by Nick Raushenbush
Updated over a week ago

Creating Pages Faster Using Our Pre-Made Page Templates

Ready-to-go page layouts to help you get started with page design, or show you what is possible with the editor.
Written by Nick Raushenbush
Updated over a week ago

Why You Should Be Using Blocks and How to Use Them

Blocks are pre-made page sections that you can re-style to taste.
Written by Nick Raushenbush
Updated over a week ago

Optimize for SEO: Using Meta Fields

Learn how to use the Meta Title and Meta Description fields for your pages in Shogun, to help optimize for search (SEO).
Written by Nick Raushenbush
Updated over a week ago

How To Create Custom Blog Page Layouts

This video tutorial will teach you how to create and edit custom blog page layouts in Shogun.
Written by Nick Raushenbush
Updated over a week ago
Elements

How To Create a Text Image Overlay

The Image element has a great text overlay feature where you can place and style text on top of an image.
Written by Nick Raushenbush
Updated over a week ago

How To Add a Youtube Or Vimeo Video to a Page

Learn how to use the Video element to embed a Youtube or Vimeo video player into your page.
Written by Nick Raushenbush
Updated over a week ago

How To Use and Style Buttons in Shogun

The button element is a great way to drive your CTA's. This video teaches you how to configure, style and position buttons.
Written by Nick Raushenbush
Updated over a week ago

Create Scrolling Sections with the Slider

The slider, sometimes known as a carousel, allows you to create scrolling sections on your page.
Written by Nick Raushenbush
Updated over a week ago

De-Clutter Your Pages Using Tabs

The tab element allows you to organize your page by placing content on different tabs.
Written by Nick Raushenbush
Updated over a week ago

Create Expanding and Collapsing Sections with Accordions

The accordion element allows you organize your page content with expanding and collapsing sections.
Written by Nick Raushenbush
Updated over a week ago

Creating a Sense of Urgency with the Countdown Timer

The countdown timer is great for ecommerce websites looking to create a sense of urgency with sales.
Written by Nick Raushenbush
Updated over a week ago

Use Social Buttons to link to Facebook, Twitter, Instagram, and more.

The social icon buttons are great for linking to Facebook, Instagram, Twitter, YouTube, Email, and more.
Written by Nick Raushenbush
Updated over a week ago

Use the Map element to Embed a Google Map

Use the power of Google Maps to show your location with the Map element.
Written by Nick Raushenbush
Updated over a week ago

How To Add and Style Images in Shogun

The image element can be resized and styled using our Aviary plugin. Click the the Edit Image button after adding the image to the page.
Written by Nick Raushenbush
Updated over a week ago

Embed your Instagram Feed into a Page

Add your Instagram feed to any page using the Instagram element. Display description and hashtag content or just the images.
Written by Nick Raushenbush
Updated over a week ago

Using the Contact Form to Receive Messages From Customers and Visitors

The contact form can be used to collect form responses from visitors to your Shogun pages.
Written by Nick Raushenbush
Updated over a week ago