Jason G. Designs

WordPress Themes, Design Tutorials, Linux Themes and more…

JGD-BizElite

JGD-BizElite is a free responsive/fixed theme with premium features. Ideal for a content heavy blog, JGD-BizElite is packed with options. Customizer modifications include WordPress’s Custom Logo, Custom Header, custom menus and background. Additional Customizer options give you the ability to hide the post date, tag and category links, and change the footer text. Eight layouts, six color schemes and two custom page templates are included.

General Features:

  • Clean, simple design
  • Support for logo upload
  • Support for a custom header background up to 1920 pixels wide
  • Ability for a blog owner to change the background behind the website as well as other customizations listed in the Customizer Options section below
  • Post image thumbnail support on home, single posts and pages
  • Custom menus
  • Widget ready
  • Two page templates useful for a custom home page
  • 404 error page
  • Custom Author page
  • Compatibility for responsive videos with the addition of the Jetpack plugin

Customizer Options:

  • Ability to hide post date, category and tag links
  • Ability to disable comments at the click of a checkbox
  • Version 1.4 lets you choose between 4 Column based layouts (2-column right or left, 3-column right or left) and 4 content area layouts (Blog, Wide Blog, Magazine (Grid Style) and Magazine (Featured Articles Style)
  • Choose between six color schemes: Black, Blue, Green, Red, Silver and Olive
  • You can hide default page decorations and change the color behind the content area
  • Customize the text for the two dropdown menus in the front end (this is useful with the Custom Menu feature
  • Customize the footer with HTML
  • Customize the Featured Categories page template, selecting posts from up to three categories

Specifications

Theme version:1.5
Works with WordPress version:4.9+
Tested in browsers:Firefox (Linux), Chromium (Linux)
Questions?/Fixes?:Use contact form below
Fixed/Fluid Layout?:Responsive/Fluid/Fixed
Width:variable
Portfolio/Contact:www.jgpws.com/portfolio
jason.sgonzalezatgmail.com

Media and Theme Preview

Take a tour of JGD-BizElite’s features in the video below.

Changelog

1.5.2 (08/21/20)

CSS fixes; Searchbar is now all the way to the right. New option for social icon color when in front of header image.

1.5.1 (08/12/20)

Minor fixes.

1.5.0 (08/11/20)

New major version that includes a breaking change for those using custom page templates. The old Landing Page template has been renamed to Thin Header. A new Landing Page template has replaced the old one with a blank full width page template. New styling for page links. Removed built in drop caps, as this is now supported in Gutenberg.

1.4.4 (08/09/20)

CSS fixes for the Landing Page template. etc.

1.4.3 (8/09/20)

Added support for the wp_body_open function.

1.4.2 (3/16/20)

Version 1.4.1 was broken because I forgot to copy over all JavaScript files to the dist folder in Gulp. This is fixed in version 1.4.2.

1.4.1 (3/16/20)

Updated screenshot; Moved template parts to template-parts folder; Adjusted Search page for the Featured Articles layout; Search results pages now use excerpts.

1.4.0 (3/11/20)

New version. Moved main menus to a new location under the header. Set a new maximum width of 1366px. Refactored the underlying code to follow SMACSS principles and use SASS. Removed individual stylesheets for custom colors/layouts and added to main stylesheet using parent class names switched via body class filters and the Customizer. Added a new Featured Articles post layout style.

1.3.1 (11/25/19)

Adjusted Gutenberg gallery styles to be similar to non-Gutenberg galleries. Adjusted JavaScript for social media icon panel. Minor fix for captioned images. New readme.txt format required for themes.

1.3 (02/18)

New major version with several new features. Added support for WordPress native Custom Logo feature. Added an option to replace meta text information with Themify icons (ex. replacing “By” with an icon font). Added support via menu for social media profile icons for blog/website owners to promote their social media pages. Other small fixes include toning down the blue link color in the default color scheme and converting some of the JavaScript live previews to use Selective Refresh.

1.2.1 (12/08/17)

Bug fix: made the default background behind the blog title and subtitle match the design for “Black (default)” when chosen in the Customizer.

1.2.0 (11/30/17 to 12/06/17)

Substituted a single SVG (Scalable Vector Graphics) image sprite in place of all background images. An SVG will look clear in high definition screens, while a single image will save on http requests. Set a max-width of 1280 pixels for the #wrapper div. Set a new default background color in Customizer of dark gray.

Fixed Pages and Category menus to use buttons for dropdowns, used absolute positioning on the menus, so that the headings don’t stretch after clicking them; Adjusted the blog title and subtitle to have a semi-transparent colored background for better contrast against background header images.

Made new functions for the color switch statements in jgd_bizelite_customizer-frontend.php. Updated the live preview to account for the new site title background design when a custom header image is shown.

Fixed magazine stylesheets to account for the new maximum width. Adjusted gallery images in magazine layouts to fit.

1.1.8 (05/11/17)

Added escaping to a few more functions; rearranged code in functions.php, so wp_enqueue_style did not have to be called a second time for wp_add_inline_style; Used the_archive_description in author.php; Fixed readme.txt to include proper licensing terminology; fixed CSS issues in the sidebar using the Monster Widget plugin.

1.1.7 (03/07/17)

Added more escaping to author.php. Missing escaping and translation wrappers added to sidebar.php.

1.1.5 and 1.1.6 (03/04/17)

Changed searchform widget again to account for title; Added escaping wrappers to attributes in jgd_bizelite_header_style function and in footer.php; Added translations to various strings; Replaced titles in Archive, Category, Author and Tag templates; Moved enqueueing of comment-reply script from the header to functions.php; Moved all add_theme_support calls into the jgd_bizelite_setup function, which hooks to after_setup_theme; Removed empty Languages folder.

1.1.4 (02/25/17)

Added esc_url() wrapper for all references to home_url(‘/’); Added translation functions to strings in author.php, sidebar.php, comments.php, 404.php; Updated licensing information for scripts and the screenshot in readme.txt; Fixed searchform widget width to fit the sidebar correctly.

Made the backgrounds for each color scheme consistent with the default color scheme. Fixed more incosistent layout issues (floated content div making content expand outside of its container).

1.1.3 (10/16)

Prefixed Customizer and other functions with the text domain (jgd-bizelite). Removed browser title bar functions and filter for full support of the title-tag theme support. Used wp_add_inline_style instead of a function to reference a template directory path in an external JavaScript file. More minor fixes.

1.1.2 (08/28/16)

Prefixed all functions and Customizer settings/controls with jbe_, so as not to conflict with other themes or plugins.

1.1.1 (04/20/16)

Fixed rendering issue in mobile view with Reply link; fixed display problem with author.php template– incorrectly named function calls were causing the page to be cut off prematurely; Got rid of the 120px height for custom header in mobile view, as this cut off long subtitles.

1.1 (04/06/16 – 04/11/16)

Updated the Continue Reading links to have a more cohesive look with other elements in the design. Made the text and header links colored to a dark variant of each color in the Customizer Styles. Adjusted other elements with a darker color as well. Made form controls cleaner and changed the color of outlines to a medium gray. Added whitespace to buttons and text fields.

1.0 (01/15/16)

JGD-BizElite has been revised enough to warrant a new version (1.0).
I Placed desktop layout styles inside of media queries for a responsive and fixed sidebar design for each of the layouts. Switched all theme options to use the Customizer, eliminating the jbe-options.php admin page. Eliminated the “Custom HTML” feature for the theme; this will be created as a plugin which I am working on. Added “up to top” and “down to bottom” buttons for tablet/mobile screen widths that scroll up to the top of the page and the sidebar (at the bottom), respectively.

Support has been added for Title_Tag, which in the future will allow plugins to customize header titles. A filter is currently used as a fallback.

0.2.1 (12/05/14)

Updated header title to newer standard using a filter for specific pages. Changed tag displayed in Administration panel description.

0.2 (10/28/13 to 10/29/13)

Updated the custom header to be compatible with WordPress 3.4 by using add_theme_support(‘custom-header’).

Updated the custom background (color) to be compatible with WordPress 3.4 by using add_theme_support(‘custom-background’).

Changed the Recent Posts default widget to use a WP_Query object, rather than query_posts() (this saves on http requests).

Placed the widgetized sidebars inside of functions, as described on the Widgetizing Themes page.

Changed references to body.home to body.blog in the magazine stylesheets, as body.home did not render the posts side by side. (body.home doesn’t take into account a blog with a static home page setting, body.blog takes both static and posts front page settings into account).

Added the script fluidVideo.js that shrinks and expands a video to the size of its parent container. Thanks go to CSS-Tricks.com for this script.

JGD-BizElite Documentation

With JGD-BizElite, you can customize many aspects of your blog or website. It includes six built in color schemes and eight different layouts. JGD-BizElite also supports many of the WordPress standard features including custom logo, custom header, custom menus and featured images.

Most customizations are done through the Customizer, WordPress’s live previewing window, where you can preview changes to your theme before saving them to the actual website. Below, we will explore JGD-BizElite’s Customizer options and what is possible, then we will look at features that exist outside of the Customizer.

How to use the Customizer

To access the Customizer, mouseover (on a desktop) or tap (on mobile or tablet), Appearance, then Customize.

Standard Customizer sections

Site Identity

Site Identity is where you can add a logo, a site icon (favicon) and change the Site Title and Tagline. To add a logo, click Select logo. From there, you can upload a logo from WordPress’s Media Library or your computer.

JGD-BizElite adds logo and/or title alignment capabilities in the Logo/Title Alignment control. Whether you have a logo by itself, a logo with titles or just titles, you can left align, right align or center your logo/title. Note that because of space constraints, the title and subtitle are not displayed when a logo and title is chosen while centered.

Colors/Color Schemes

In earlier iterations of this theme, color schemes were placed under a Styles/Layout section. In the latest version, I thought it makes more sense to place color schemes here and rename the section.

Background Color sets the overall background behind everything.

The Color Schemes change the main background and many other things: the background behind the header, link colors and decorations, to name a few. The color schemes are pallettes of black (default), blue, green, red, silver and olive.

You can also set the Content and Sidebar background color via the control with that name. Here, you can set a dark color behind the content, if you wish.

If you use a dark background, select Use light text for dark background to reverse the text to white and some supporting background colors to black.

You can also hide the background texture and decorations in this section.

Header Image

The Header Image section is where you can upload a custom header image. This was previously the only option for a logo in JGD-BizElite. Image sizes up to 1280 pixels wide are supported. The header container stretches vertically to fit the header image.

For images that are less wide than the recommended width, there are three alignment options listed just under the upload controls: Left, Center and Right with Center as the default.

Background Image

The standard Background Image feature lets you choose a background image to fit behind the entire content wrapper. Since this feature has many options, you can find more information in the WPBeginner article, “How to Add a Background Image in WordPress“.

Each color scheme comes with its own background color behind the entire page. If you override this setting by selecting a color in the Colors -> Background Color control, you can restore the color scheme’s background color by clearing the Current Color text field. *Note that this does not preview live but after saving and publishing.

Menus

In the menu section you can create custom menus to be displayed in selected areas. JGD-BizElite supports three different menu locations: Two dropdowns in the upper right of the top “access” bar and a Social Profiles location- more on that later…

How to use:

  • Create New Menu and give it a name
  • From there, under Menu Locations, you can select Header First Menu, which displays your website’s Page links when there is no custom menu. Header Second Menu is in place of your websites Categories. Social Profiles menu is for social media icons
  • Click Add items. Items can be custom links or links to Pages, Posts, Category and Tags
  • Next, assign the menu items to one of the Menu Locations. Once you Publish, they will show up on the front page

The titles for the first two menus can be customized from the Display Options section, described later. This may be necessary when using custom menus.

Widgets

The Widgets section works similar to the Menus section. JGD-BizElite has two widget areas, Primary Widgets and Secondary Widgets. In two column layouts, the primary widget area is stacked on top of the secondary widget area. In three column layouts, the primary and secondary widget areas are side-by-side. Once you click one of widget area sections, click Add a Widget, where you can select from several available widgets.

Homepage Settings

This section is where you can choose whether to display Your latest posts as the front page or A static page.

If a static page is chosen, you can set a custom page to be the front page. JGD-BizElite comes with two page templates, a Landing Page with a thin header and a Featured Categories page template that supports content. These will be explained in the Page Templates section of this documentation.

Custom CSS

Since WordPress 4.7, you can further customize any theme’s appearance with Cascading Style Sheets. Not satisfied with the customizations JGD-BizElite offers? Now you can make things look exactly how you want them. To learn what is possible with CSS, you can study a tutorial like Learn to style HTML using CSS on the Mozilla Developer Network.

Theme specific Customizer sections

Layout

In the layout section, you can switch between eight layouts, with four “magazine” style layouts:

  • 2-column right (the default)
  • 2-column right magazine
  • 3-column right
  • 3-column right magazine
  • 2-column left
  • 2-column left magazine
  • 3-column left
  • 3-column left magazine

The magazine layouts feature posts displayed side-by-side in columns.

Display Options

In this section, you can add and/or subtract content from your website or blog.

  • Hide the post date (except on archive pages)
  • Disable comments
  • Hide the comments link (used with Disable comments)
  • Hide category links
  • Hide tag links
  • Use icons in place of and next to titles (new in version 1.3)

In addition, you can replace the titles “Pages” and “Categories” that appear in the upper left of the theme’s access bar. This is useful when you are replacing the two dropdown menus with custom menus.

Change the footer information does just that. This text box also supports the same HTML that WordPress posts support.

Other Features

Featured Images

You can add a featured image to a post or page. In the post or page edit screen look for Featured Image in the lower right. A Featured Image appears as a medium sized thumbnail next to your post content.

Page Templates

JGD-BizElite includes two page templates shown below.

Landing page template
Featured Categories template

A Landing Page template has a thin header with only the site title and possible social media icons. The rest of the space is for your content.

The new Featured Categories template features a content area with no title or author information and a section with up to three latest posts from three different categories.

Both page templates don’t have sidebars or a comments section.

Social Media icons

Social Media icons diplay in the upper right corner of the access bar (gray top bar in the default color scheme). In order for icons to show up, profile links must be assigned to the Social Profiles menu location. Create a New Menu and name it. Then click Add Items and add Custom Links. When a custom link for facebook.com, for instance, is added as a URL, the Social Profiles section on the front end will display Facebook’s logo with a link to your specified profile or page.

The following social websites have icon support:

  • Facebook
  • Twitter
  • Instagram
  • Pinterest
  • GitHub
  • Google+
  • Tumblr
  • WordPress (.com or .org)
  • YouTube
  • Vimeo
  • Flickr

Responsive Videos

This theme is capable of displaying responsive videos that scale with the parent container. In order to enable responsive videos, the Jetpack plugin must be installed and activated.

5 Comments

  1. Karma says:

    I really love this Template and I am currently using it at my place. However… I’d like to make the access navbar you have above the header, below it. Because of the fact, the dropdown list you got there blends in with the header itself. If you could explain to me how I can fix that myself I could.

    Thanks, Karma

    1. Jason Gonzalez says:

      Hello Karma.

      I received an email for this comment and will be looking into this tomorrow to see what I can come up with. When I do, I’ll post here in the comments section.

    2. Jason Gonzalez says:

      So, I figured out a way to display the access bar beneath the header. How easy this will be to implement will depend on if you are using WordPress 4.7 or above.

      I was able to use only CSS and did not have to move any HTML around.

      In the Customizer under Appearance > Customize, go to Additional CSS. Pasting the following will move the entire access bar and its contents:

      @media screen and (min-width: 48em) {
        #branding {
          margin-top: 0px;
        }
      
        #access {
          position: static;
          border-bottom: 1px solid rgba(0, 0, 0, 0.25);
        }
      
        #searchbar,
        #menu-social {
          top: auto;
        }
      }
      

      If you plan on adding social menu icons in the future and want them to be displayed in the upper right, you can remove #menu-social from above and add a new style rule just below it:

        ...
        #menu-social {
          border-left: transparent;
        } 
      

      Also, it looks like the menu backgrounds have been customized. It might be a good idea to add a semi transparent background behind the dropdown menus:

      #menubar .pagemenu,
      #menubar .catmenu {
        background-color: rgba(0, 0, 0, 0.5);
      }
      

      I hope this helps!

  2. Does your site have a contact page? I’m having a tough tiume locating it but, I’d like to shoot you an
    e-mail. I’ve ggot some creative idea for your blog you might be interesdted in
    hearing. Eiher way, great website and I lookk foward to seeing it expand over time.

  3. Ray B says:

    JGD BizElite looks very promising. We are considering migrating from LightCMS to WordPress and this could be the template we need.

Trackbacks and Pingbacks

Trackback URL for this post: https://www.jasong-designs.com/2012/02/17/jgd-bizelite/trackback/

  1. […] JGD BizElite is ideal for a small business websites or blogs and is packed with options. […]

  2. […] JGD BizElite is ideal for a small business websites or blogs and is packed with options. […]

  3. […] JGD BizElite is ideal for a small business websites or blogs and is packed with options. […]

  4. […] JGD BizElite is ideal for a small business websites or blogs and is packed with options. […]

  5. […] checking up on JGD BizElite (shameless plug), a message appeared at the top of the Dashboard to update the Custom Header. […]

  6. […] changes are on the way for JGD-BizElite. It is currently being converted to use the Customizer instead of a theme options page. The process […]

  7. […] computer or mobile phone to see how it looks and feels. The newly updated theme can be found at its page. Thanks to everyone who has downloaded and used this […]

  8. […] from a text box for previewing on the front end, such as the Header Title. I also used it in JGD-BizElite for showing and hiding small things like Category links, for […]

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.