1. Documentation
  2. Themes
  3. Forefront

Forefront

Forefront is a fully responsive theme that helps you to create a strong-yet beautiful-online presence for your business. Forefront’s layout adjusts itself depending on the device you are using. This means your site will look good not only on desktop and laptop browsers, but also on devices with smaller screens, such as mobile phones and tablets. If you install Jetpack, you can easily create testimonials and display social links.

Note: This product has been retired. Documentation is no longer being updated.

Installing your Theme ↑ Back to top

To learn how to install your theme please reference our documentation here: Installing a Theme

Checking your theme version ↑ Back to top

You can confirm your theme version by going to: Appearance > Themes

Activate your Theme Key ↑ Back to top

After you install your theme, be sure to activate your theme key by downloading and installing the WooCommerce Helper plugin. This will verify your site when contacting support and will enable 2-click updates for quick theme upgrades down the road.

Updating your theme

It is very important to ensure you have the latest version of your theme at all times. This is the best way to proactively troubleshoot issues on your site.

Please reference the WooCommerce Helper Documentation to learn more.

Front Page Template ↑ Back to top

As the name suggests, this template is perfect for the front page where you can introduce your business to the world. Rich, powerful, and flexible, the front page template includes three optional widget areas, a big leading image with a call-to-action, and two testimonials.

When you first activate Forefront, you’ll see your posts in a traditional blog format but if you’d like to use this template as the front page of your site, here is the instruction.

  1. Create or edit a page, and assign it to the Front Page template from the Page Attributes module.
  2. Go to Settings → Reading and set “Front page displays” to “A static page”.
  3. Select the page you just assigned the Front Page template to as “Front page” and then choose another page as “Posts page” to serve your blog posts.

Call to Action Button ↑ Back to top

If you would like to add a “call to action” button like the demo site, you can add the built-in CSS class button to an HTML link by switching to Text mode in the editor. For example:
<a href="https://yourgroovysite.com/" class="button">Visit my page</a>

Front Page Widgets ↑ Back to top

Now that you have set your home page, you can go to Appearance > Widgets and set your widgets for ‘front page area one’ and ‘front page area two’. ‘Front page area two’ widget section displays below ‘front page area one.’ For best results, it’s recommended to set three widgets for each section.

Grid Page Template ↑ Back to top

The grid template is great for a portfolio page, a case study page, or a page to introduce your team members.

  1. Create or edit a page, and assign it to the Grid Page template from the Page Attributes module.
  2. This page displays all child pages of this page with featured images in a grid.

Full Width Page Template ↑ Back to top

The full-width template gives you plenty of space to embed a map of your office or showreels.

Testimonials ↑ Back to top

To make the Testimonials menu appear in your admin, you need to install the Jetpack plugin because it has the required code needed to make custom post types work for the Forefront theme.

Once Jetpack is active, the Testimonials menu will appear in your admin, in addition to standard blog posts. No special Jetpack module is needed and a WordPress.com connection is not required for the Testimonials feature to function. Testimonials will work on a localhost installation of WordPress if you add this line to wp-config.php: define( 'JETPACK_DEV_DEBUG', TRUE );

The Testimonials admin
The Testimonials admin

On your site, two randomly chosen testimonials appear on the front page template so that every testimonial has an equal chance to be there. All testimonials are displayed in a testimonial archive page.

Where is the Testimonial archive page? ↑ Back to top

Let’s say you have a WordPress.com site at: http://mygroovysite.com/

The URL of the testimonial archive page will be: http://mygroovysite.com/testimonial/

You’ll need pretty permalinks (any structure) for this URL to work though. If you’re stuck with default permalinks – your links have a query string at the end, like ?p=123 – then your testimonial archive can be accessed by adding this immediately after your URL: /?post_type=jetpack-testimonial

The Testimonials archive page
The Testimonials archive page

Customizing the Testimonial archive page ↑ Back to top

Once you have published a testimonial, under the Testimonials menu in your admin, you will see a link that takes you to the Customizer where you can edit the page title, add an intro text and a featured image. Just make sure you have pretty permalinks (any structure) for this to work.

Customizing the Testimonials archive page
Customizing the Testimonials archive page

Social Links ↑ Back to top

  1. Make sure you install Jetpack and activate the plugin, and connect it to your WordPress.com account.
  2. In the Jetpack dashboard, activate the Publicize module.
  3. Under Settings Sharing, connect to your preferred social network(s).
  4. Under Appearance Customize, in the Connect panel, select the appropriate social media accounts and save your settings.
  5. The social media icons for the accounts you’ve selected should now appear in your footer.

Widget Areas ↑ Back to top

Widgets are flexible and great tool to customizing your sites.

Forefront offers four widget areas:

  • Sidebar widget area which appears on the right.
  • Optional footer widget area.
  • Two optional widget areas on the front page template.

Quick Specs ↑ Back to top

All measurements in pixels:

  1. On single posts and the default page template the main column maximum width is 600.
  2. On the full width page template the main column maximum width is 1050.
  3. The featured image works best with images at least 1230 wide for pages, 810 for posts.

WooCommerce - the most customizable eCommerce platform for building your online business.

  • 30 day money back guarantee
  • Support teams across the world
  • Safe & Secure online payment