USING WIREFRAME # 3
Extended Article | Body Text, Images & Captions

FEATURES

This wireframe showcases images or videos with longer text. Images/Videos are accompanied by captions. Ideal for design projects that combine writing with diagrams and images, or pairing artwork with selections of thesis book text.

See Sample 1

See Sample 2

GETTING STARTED: FILLING IN YOUR WIREFRAME

This video will walk you through how to fill in the Wireframe Option 3 with your thesis content.

 

Contents:

00:31 * Layout View
01:22 * Name & Thesis Title
02:15 * Web & Social Links
03:57 * Abstract
05:22 * Section 4 & Beyond: Your Work
07:01 * Header/Title in a Basic Block
07:43 * Body Text Box in a Basic Block
08:12 * Replacing the Placeholder Image in an Image Block
09:37 * Caption in a Basic Block
10:26 * Carousel Block
12:15 * Endnotes & Bibliography
15:45 * Saving
16:17 * What’s in the Next Video


ADDING, MOVING, DELETING: CUSTOMIZING YOUR WIREFRAME

In this video,  we will customize the wireframe to suit your own individual needs, because nobody fits exactly into a template. We’ll cover deleting, moving, and adding content to your page. This means that you can change the type of content—for instance, maybe you want to swap out all the image blocks for image carousels. Or you can modify the layout—for example, maybe you want to add some more image and text segments, or another carousel segment, or just make up a whole new type of segment!

 

Contents:

00:46 * Deleting Overview
01:08 * Deleting a Section
01:33 * Deleting a Block
02:02 * Moving Blocks
04:08 * Adding New Blocks & Sections
06:47 * Adding 3 New Sections to Create a New Segment of Body Text & Image
06:56 * Adding a Section for a Horizontal Rule
07:48 * Adding a Section for an Header
08:13 * Adding a Section for an Body Text & an Image
08:37 * Adding a Basic Block for a Horizontal Rule
09:27 * Adding a Basic Block for a Header
10:22 * Adding a Basic Block for a Body Text Box
12:59 * Adding an Image Block
13:55 * Adding a Basic Block for a Caption
15:40 * Adding a Carousel Block
16:52 * Adding a Video in a Basic Block
18:07 * Adding a Hero Block
19:40 * Adding a Label in a Basic Block

 


 

QUICK REFERENCE:

 

*** Labels *** 

1. WYSIWYG Styles (in order they are written)

         Title  >> (Text Primary, Text Color White, Header 3)

         Fields 1-3 >> (Text Secondary, Header 3)

         Description >> (Text Primary, Header 3)

 

 

*** Captions *** 

1. The Arrow: ▲

2. WYSIWYG Styles (in order they are written)

         >> (Text Secondary, Header 4)

3. Block Styles

         >> Component Custom Class: caption pt-2 pb-4

 

 

*** Body Text Box *** 

1. WYSIWYG Styles (in order they are written)

         >> (Text Primary, Header 3)

 

2. Block Styles

         >> (FOR BLOCKS ON THE LEFT) Component Custom Class: broider-border ml-md-2 ml-lg-3 mr-md-4 mr-lg-4  my-3
         >> (FOR BLOCKS ON THE RIGHT) Component Custom Class: broider-border mr-md-2 mr-lg-3 ml-md-4 ml-lg-4  my-3
         >> Component Column Count: 2 Columns

 

 

*** Section for a Hero Block *** 

1. Section Configuration Settings

         >> 1 Column
         >> Row Width: 100%
         >> Enable Hero Row