Drea - Home Widgets

The instructions below will help you configure the widgets on the home page.


Slider

Click here for instructions for the slider - how to display featured posts, some troubleshooting advice and how to avoid blurry images.


Newsletter

Click here for instructions on how to connect MailChimp to the subscribe form + the HTML for the form in the sidebar.

This is the HTML of the form on the home page (some additional HTML to customize it - you can add the form action link the same way):

<div class="newsletter-wrapper"><div class="newsletter-wrap">

<div class="newsletter-header">
<h5>Subtitle</h5>
<h3>Title</h3>
</div>

<form action="FORM-LINK" class="signup-form" method="post" target="_blank">
<input type="email" name="EMAIL" placeholder="Email address" value="" required />
<input type="submit" value="Subscribe" />
</form>

</div></div>

Replace "Subtitle" and "Title" with your own text.


Featured Boxes

The featured boxes are the 3 boxes below the profile section on the home page. You can use them to highlight important pages or label pages on your blog.

Before you start! The Image widgets in "Home Before Content (Grid)" have been altered for customization. If you remove them and then re-add them, they will not look the same. If you want to hide them for now, open each widget > uncheck "Show this widget" at the top and save the changes.

Go to Layout > scroll down to "Home Before Content (Grid)" > open each Image widget and add your information.

  • Title - replace "Featured Box Title" with your own title
  • Subtitle - add your text to the "Caption" field; make it short & sweet so the text wont cover the entire image
  • Image - check "Upload image from computer" below Select image by: and upload an image
  • Link - add your link to the "Link" field

How to add a title?

Go to Layout > scroll down to "Home Before Content (Grid) Header" > add a HTML/JavaScript widget > add your title to the "Title" field and save the changes.


Profile

The profile is the "I'm Drea; traveler and food blogger." section on the home page. You can use it to add some information about yourself and your blog.

Before you start! The "Profile: Image" and "Profile: Text" widgets have been altered for customization. If you remove them and then re-add them, they will not look the same. If you want to hide them for now, open each widget > uncheck "Show this widget" at the top and save the changes.

Go to Layout > scroll down to "Home Before Content 1".

Add an image - open the "Profile: Image" widget > check "Upload image from computer" below Select image by: and upload an image (don't add any text, just save the widget after you upload your image).

To add a title, text and a link to the button, open the "Profile: Text" widget.

  • Subtitle - replace "Hello & welcome!" with your own subtitle; don't remove the h5 tags around the title
  • Title - replace "Add a title here" with your own title; don't remove the h3 tags around the title
  • Text - replace "Add some text here." with your own text; don't remove the p tags around the text
  • Link - replace LINK with the link to your About page

Here's the HTML in the "Profile: Text" widget:

<h5>Hello & welcome!</h5>

<h3>Add a title here</h3>

<p>Add some text here.</p>

<a href="LINK" class="profile-button">get to know me!</a>