Atomic Blocks Tips For Layout Templates

Building a web page using an Atomic Blocks Layout is easy. And, I hope, these Atomic Blocks tips will help you hit the ground running.

• What do the page Layout templates look like?
• How do I build a page using a Layout template?

If you’re new to using the Layout templates, you’ll find these Atomic Blocks tips for layout templates useful.

Don’t just type your text directly into the web page. Save all of your text as a text file using a text editor, such as Word Pad. Then if you want to start over, you won’t lose the text.

My Hero Header image looks offside or funny

If this happens to you, try choosing a different width option for the header block.

If the hero header looks offside in your theme, try a different width option button.

No blog posts

The Freelance Layout template has a section labeled “My latest blog posts”, but no posts are showing.

That’s because you haven’t published any blog posts yet. When you publish blog posts, your most recent blog posts will automatically display here.

Change the Google Map and Mailto: link

The Atomic Blocks Business Layout template has a Google Map, and a button that opens your email program when clicked.

We will be using Google Maps in this tutorial.

1.) Search for your address, post code or zip code.
2.) Click the Share button.

3.) Select the Embed a Map tab.
4.) Then click the “Copy HTML” option.

5.) In the WordPress post editor, click the HTML block. Remove the demo code and paste in your new map code.

Replacing the “Drop us an email!” link

• Click the button to open the edit dialogue box.
• Replace name@example.com with your own email address.
  But be careful not to remove the mailto: section.

An example…
mailto:hmqueen@royal.uk

How do I add my Mailchimp API key, so my newsletter signup form will work?

You will need a free Mailchimp account to do this.

First get your API key from Mailchimp.

Then go to Dashboard >Atomic Blocks > Settings: and paste your API key in the box.

You will also need to choose the list you want to use for that specific Newsletter block.

This newsletter signup block comes from the Product Launch One layout.

Click the Configure Your Settings link, and select the list you want to use. The setting is in the WordPress post editor sidebar.

Some of the text is too big!

Some themes use small body text and some themes use large body text. This is especially noticeable when you change from one theme to another.

If you want to reduce the size of paragraph text in a particular block…

1.) Select the block.
2.) In the paragraph’s block settings change the font size.

If you mess things up, you can start again (this is an important Atomic Blocks tip!)

There is an easy way to remove all of the blocks on your page, so you can start that page afresh.

• Click the three dot button in the top right of the WordPress post editor.
• Select the Code Editor option.
• You now see the HTML that makes up this page.
• Select all of the HTML, then delete all of the code.

You are now in the code editor, and you need to go back to the visual editor.

The green bar is hiding the button we need. So click the X close button.

Now you can see, and click the Exit Code Editor Button.

You now have a clean, empty page. You can start afresh.