Layout for Genesis Associate Theme 2

There’s more than one way to lay out the Associate child theme for Genesis.

Take a look at how the widgets are arranged in this theme

associate-widgets

I’ll use my own personal site Senior at Large as an example

  • I’m using the Genesis Slider in the Featured widget slot
  • I ignore Home Middle #1, Home Middle #2 and Home Middle #3
  • I have 3 Featured posts widgets in Home Bottom #1
  • I have 2 Text widgets in Home Bottom #2
  • I have one Featured post widget in each of Footer #1, #2 and #3

Have a look inside the Featured Posts widgets in my Home Bottom #1

associate-widgets-layout-susanna-1

Let’s look at my Home Bottom #1 in closer detail. I’ll open up the first Featured Post widget so you can have a look how I’ve configured it.

 

associate-widgets-layout-susanna-2

From the left side, going down vertically, you’ll see that :-

  • I have no widget title (widget titles are not clickable)
  • I chose the Category ‘La Cucina Siciliana’ configured to show one post
  • Author Gravatar not enabled
  • Featured Image enabled, set to thumbnail size and aligned left

From the right side, going down vertically

  • The Post title is enabled (post titles are clickable)
  • No ‘Show Post Info’
  • The Content type is set to ‘Show Content Limit”. You can toggle those options in the dropdown box. My Content is limited to 275 characters (the number of characters is your choice – experiment with the number to suit your site)
  • For ‘More Text (if applicable) I have [Read More…] You can change this text and also keep, or discard, the brackets
  • I go straight to the bottom of that widget and enable the link to the Category archive
  • I’ve made the text of that link to be “More from La Cucina Siciliana”

Now we come to my Home Bottom #2

It looks like this – with 2 text widgets

associate-widgets-layout-susanna-3

This one’s not so straightforward, but not too hard at all once you get your image. You need to use one teeny bit of HTML to get your image into a text widget.

Putting an Image into a Text widget

First, get your image. This must be no larger than 250p in width.

Upload your image using the ‘Add New’ link under Media

associate-widgets-layout-susanna-4

Now you have an unattached image in your Media library.

Next step – hover your mouse over that image and choose the Edit option. You need to get the URL of that image file.

associate-widgets-layout-susanna-5

Click on the Edit and, when that Edit page opens, look over to the right and you’ll see where the File URL is hiding itself.

This is what it looks like on my site

associate-widgets-layout-susanna-6

You have to drag your mouse across that File URL so that you can copy all of it
Make sure you have the complete URL, with the http at the start and the type of file at the end (in this case, the file is a  .jpg)

associate-widgets-layout-susanna-7

You have to copy that URL into a Text widget. And here’s the teeny bit of HTML

You’re going to tell the Text widget to display an image source – that’s <img src> and the HTML looks like this

associate-widgets-layout-susanna-8

Don’t forget the equal sign ( = ) and the inverted commas. And don’t forget to close that bit of HTML ( > )

I’ve added some text around my image but that’s my choice to direct the visitor to my recipes.

What you see on my site is my lovely new photo showing me with a half a tonne of makeup.

The second text widget holds a little promo image for this site.

P.S You can see another layout style in Layout for Genesis Associate Theme 1 and how to configure it