Beaconby Pro Theme Design

Custom Header

Beacon makes use of WordPress custom headers.

Custom Menus

Beacon has two custom menu areas available. The Top Menu is used for standard website navigation. The Social Menu is used for linking to social channels such as Facebook and Twitter and will replace the link text with icons for the channels. There’s more information on this in the Social Links section below. If there are no custom menus configured then the menu will display a list of your site’s pages. To find out more about how to set up your menus, see the Custom Menu documentation.

Featured Images

Beacon supports Featured Images on blog posts. To use featured images:

  1. Edit the post you want to add the featured image to
  2. Find the box labeled Featured Image
  3. Click Select featured image and then either select the image or upload a new one using the options provided
  4. Once selected, press Set featured image
  5. Click the Update button to save changes to your post

On the homepage and archive pages the Beacon featured images are scaled to 268 x 150.

Local Languages

Beacon has full support for both left-to-right and right-to-left languages. For information on translating Beacon you can check out the translation FAQ.

Featured Content

Beacon uses Featured Content to display posts at the top of the home page, below the navigation. This involves choosing a post tag that signifies that your posts are special. You can set the featured tag in Appearance → Customize → Featured Content.

To set up Featured Content:

  1. Go to Appearance → Customize → Featured Content
  2. Enter a tag name for the featured posts – make sure it’s unique and isn’t used anywhere else
  3. Edit the posts that you want to display in the featured content area, and give them the featured tag you have just selected

Trending Topics

Trending Topics are displayed at the top of the site automatically. They are ordered by the number of posts per category. The more posts you have in a category, the earlier they will appear on the list.

If you want to hide the Trending Topics then you can do so with Custom Design which is included with Plans. To hide the Trending Topics, copy and paste the following CSS into the Custom CSS editor:

.trending .topics { display:none; }
.trending { padding-top:30px; }

Featured Content Background Image

The Featured Content area can have a custom background image, allowing for even greater personalization of your site.

To upload the image, go to Customize → Theme and upload a Featured Content Background Image. You can use any size image and it will be scaled to fit, however, an image sized short and wide is ideal, such as 1200 x 200. Keep in mind the shape of the image since the top is likely to be hidden if you use anything too tall.

Social Links

Beacon allows you to display links to your social media profiles, like Twitter and Facebook, with icons.

Available icons

Linking to any of the following sites will automatically display its icon in your menu:

  • CodePen
  • Digg
  • Dribbble
  • Dropbox
  • Facebook
  • Flickr
  • GitHub
  • Google+
  • Instagram
  • LinkedIn
  • Email (mailto: links)
  • Pinterest
  • Pocket
  • Polldaddy
  • Reddit
  • RSS Feed (urls with /feed/)
  • StumbleUpon
  • Tumblr
  • Twitter
  • Vimeo
  • WordPress
  • YouTube

Front Page Categories

The front page categories display under the latest posts. They will each display 5 posts, 1 large and 4 small. You can select which categories display in the Customizer in the Theme section. Just select the category from the dropdown and it will be added to the list. Once added, you can drag and drop their order to change the front page layout.


Beacon has 2 sidebar areas. There’s information about how to add widgets to sidebars available here.

All sidebars will hide if there are no widgets to display. The remaining content will resize to fill the empty space.

Sidebar Widgets is displayed on the right-hand side of the front page on single posts and pages — it will not display on archive pages. Footer Widgets will display at the bottom of your website. They are arranged in 4 columns and lined up automatically to make the best use of the space available.