Google Font Variants

Google Font Variants

In GPP 1.4, it』s now possible to choose the font variants you need for your chosen Google Fonts.

This is important, as each variant that has to load is an extra file your website has to load. Reduces the number of variants that load will speed your website up – sometimes considerably.

Let』s take Open Sans for example:

By default, we have all of those variants:

300 – super light300italic – super light, italicregularitalic600 – semi-bold600italic700 – bold700italic800 – super bold800italic

Now if we know in our content we』re only going to need a few of these, we can remove the ones we don』t need and our site will load faster. So, my site only needs:

300 – some light headlinesregular – all of my content700 – bold is definitely needed from time to time

Now, if I』m loading a different font just for my site title, I know that my site title is only going to be one style – light, bold, italic etc.. This means we can specify the one and only one variant that we need for this area.

Cache Dynamic CSS

Cache Dynamic CSS

Note: This is a new option in GeneratePress 2.0

The option can be located in Customizer > General.

Many of your Customizer options write CSS for you, and output it to your pages. Instead of generating this dynamic CSS on every page load, we cache it in the database and serve the cached CSS instead. As you can imagine, this is a big performance boost.

On first load, the CSS will be cached and added to the database. Any time you save the Customizer options, the cache will bust and get updated with your new CSS.

Remove Google Fonts

Remove Google Fonts

By default, Google Fonts won』t load if you don』t choose a Google Font in the customizer. If for some reason you still want to remove it. Try the PHP snippet below:

add_action( 'wp_enqueue_scripts', function() {
wp_dequeue_style( 'generate-fonts' );
} );

If you wish to remove Google Fonts from the customizer as well, you can use the PHP snippet below: 

add_action( 'admin_init', function() {
add_filter( 'generate_google_fonts_array', '__return_empty_array' );
} );

generate_logo_output

generate_logo_output

The generate_logo_output filter allows us to alter the HTML of our logo.

Setting a Width and Height

If want want to set a specific width and height in the logo HTML output:

add_filter( 'generate_logo_output','tu_logo_atts', 10, 2 );
function tu_logo_atts( $output, $logo ) {
printf(
'

',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
esc_url( apply_filters( 'generate_logo', $logo ) )
);
}

Adding a New Class

If we want to add a new class to our logo container:

add_filter( 'generate_logo_output', 'tu_logo_class', 10, 3 );
function tu_logo_class( $output, $logo_url, $html_attr ) {
printf(
'

',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
$html_attr
);
}

Open a New Window

If we want our logo to open in a new window:

add_filter( 'generate_logo_output', 'tu_logo_target', 10, 3 );
function tu_logo_target( $output, $logo_url, $html_attr ) {
printf(
'

',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
$html_attr
);
}

Remove the Logo Link

If we don』t want a link surrounding our logo:

add_filter( 'generate_logo_output', 'tu_no_logo_link', 10, 3 );
function tu_no_logo_link( $output, $logo_url, $html_attr ) {
printf(
'

',
$html_attr
);
}

Site Library Unavailable

Site Library Unavailable

Constant loading

If your Site Library page is in a constant state of loading, it can mean your WordPress installation is having trouble connecting to the WordPress REST API.

If this is the case, a simple fix that usually works is going to 「Settings > Permalinks」 and clicking the Save button. This can sometimes kickstart WordPress to start recognizing the REST API as it should. Now go into the Library to see if the sites are loading.

No sites found

If you can see the Site Library tab, but no sites exist, it means your server isn』t able to communicate with gpsites.co

First, click the 「Refresh Sites」 button. This will try to fetch the sites again.

Note: As of GP Premium 1.8.2, it may be necessary to click the Refresh Sites button twice (if nothing changes on first click). This will be fixed in GP Premium 1.9.

If that doesn』t work, install the Query Monitor plugin. Once installed and activated, head back to 「Appearance > GeneratePress > Site Library」 and click the Refresh Sites button again.

In your admin bar, hover the Query Monitor area and click the HTTP API Calls link, as the screenshot below shows.

The most common error is shown above: cURL error 28

This typically means your server isn』t able to communicate with gpsites.co (where the API for our Site Library lives).

You can check with your hosting support, as they will be able to tell why the error is happening.

If there isn』t a block in place, it』s possible that ModSecurity is enabled on your server. Ask your hosting to disable it while you use the Site Library. It can be turned back on once you』re done using the importer.

Supported PHP Version

If you activate GP Premium and the Site Library module but do not see the Site Library tab, it means your site is using an old version (<5.4) of PHP. You can check the version by using Display PHP Version plugin.

Our recommendation would be to use PHP version 7+ for the security and speed of your site.

Move WooCommerce Cart Toggle Into the Menu Items

Move WooCommerce Cart Toggle Into the Menu Items

By default, the WooCommerce cart icon is separated from the main menu like this:

If you prefer move the icon as part of the menu items like this:

Then try the following PHP snippet:

add_filter( 'wp_nav_menu_items', function( $items, $args ) {
if ( 'primary' === $args->theme_location ) {
$has_items = false;

if ( ! WC()->cart->is_empty() ) {
$has_items = 'has-items';
}

return sprintf(
'%1$s

',
$items,
generatepress_wc_cart_link(),
is_cart() ? 'current-menu-item' : '',
$has_items
);
}

return $items;
}, 10, 2 );

generate_element_display

generate_element_display

The generate_element_display allows us to bypass the Display Rules, so we can enable or disable an Element under our own conditions.

This filter replaces the previous generate_header_element_display, generate_hook_element_display and generate_layout_element_display.

Display an Element to a Specific Author

For example, if we want to assign a specific element to Author Tom only:

add_filter( 'generate_element_display', function( $display, $element_id ) {
if ( 100 === $element_id && is_author( 'Tom' ) ) {
$display = true;
}

return $display;
}, 10, 2 );

You need to replace 100 with the ID of your Element.

Display an Element to a Parent Page and All Child Pages

Another useful example is to set the hook to display on the parent page and all the child pages automatically:

add_filter( 'generate_element_display', function( $display, $element_id ) {
global $post;

if ( 1180 === $element_id && ( is_page() && $post->post_parent == '415' ) ) {
$display = true;
}

return $display;
}, 10, 2 );

You need to replace 1180 with the ID of your Element, and 415 with the ID of the parent page.

Display an Element to the First Page of Archives Only

Another request that we get from time to time is to only show page hero on the first archive or posts page and turn off for 2nd and subsequent pages of posts. This can be done with the snippet below:

add_filter( 'generate_element_display', function( $display, $element_id ) {
if ( 100 === $element_id && is_paged() ) {
$display = false;
}

return $display;
}, 10, 2 );

You need to replace 100 with the ID of your Element.

Remove an Element when No Featured Image is Uploaded

If you would like to remove a block element page hero automatically when no featured image is uploaded instead of using the display rules manually, this snippet can be used:

add_filter( 'generate_element_display', function( $display, $element_id ) {
if ( 100 === $element_id ) {
if ( ! has_post_thumbnail() ) {
$display = false;
}
}

return $display;
}, 10, 2 );

You need to replace 100 with the ID of your Element.

Block Element – Archive Navigation

Block Element – Archive Navigation

Starting in GP Premium 2.0, you can create an archive navigation in the Block Element module with the help of Dynamic Blocks and Dynamic Data.

You can access it by creating a new block element, then select archive navigation under the Element type dropdown menu:

Settings

Templates

Import a template.

Hook name

Select one of hooks to insert the archive navigation.

Priority

Set the priority of the archive navigation. This is useful when there are multiple elements added within the same hook.

Disable default pagination

Remove the default pagination.

Keep default archive navigation container

Keep the default paging-navigation container so the content padding applies.

Site Library Templates Developers

Site Library Templates Developers

Mike Oliver Design

Search

Shop

Realtor

Dev

Donate

Cloud

Stream

Health

Portfolio

Mason

Vinyasa

Coach

Ethos

Landing

Avery

Wired

Read

Agency

Java

Service

Access

Abstract

Trade

Pivot

Pixel

Wordsmith

Artisan

Catalyst

LH Consulting

Flow

Emerald

Idea

Decor

Studio 7

Feather

Aroma

Dance

Vacation

Charge

Grill

Broadcast

Rumour

Prime

Target

Flint Skin

Niche

Imprint

Digital Creative

Mentor

LearnEd

Volume

Merch

Bold

Vibe

Liberte

Dispatch

Uno

Navigator

generate_mobile_header_logo_output

generate_mobile_header_logo_output

Note: This filter requires the Menu Plus add-on in GP Premium.

The generate_mobile_header_logo_output filter allows us to alter the HTML of our mobile header logo.

Avoid Lazy Loading

If we want a caching plugin like WPRocket not to lazy load the mobile header logo with a filter, this PHP snippet is required:

add_filter( 'generate_mobile_header_logo_output', function( $output ) {
if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
return $output;
}

$settings = wp_parse_args(
get_option( 'generate_menu_plus_settings', array() ),
generate_menu_plus_get_defaults()
);

return sprintf(
'

',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
);
} );

Setting a Width and Height

If want want to set a specific width and height in the logo HTML output:

add_filter( 'generate_mobile_header_logo_output', function( $output ) {
if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
return $output;
}

$settings = wp_parse_args(
get_option( 'generate_menu_plus_settings', array() ),
generate_menu_plus_get_defaults()
);

return sprintf(
'

',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
);
} );