What Is The Result?

The related posts section is displayed below your post content by default. Also, it’s a great feature that helps your users find additional interesting content from the same category. But, at the same time, this means that your users might overlook the comments section before moving to a related post.

Thus, you might want to move this section below the comments section, allowing your user to first go through comments. Further, you can do this easily by adding a custom code to your website.

How To Do This?

To disable Astra Global colours in Elementor, you need to add an action. You can add the following custom code to the functions.php file of your Child Theme:

# Move Related Posts Below Comments

add_action( 'astra_entry_before', function() {
	add_filter( 'astra_get_option_enable-related-posts', '__return_false' );
} );
add_action( 'astra_primary_content_bottom', function() {
	add_filter( 'astra_get_option_enable-related-posts', '__return_true' );
} );
add_action( 'astra_template_parts_content_top', 'action_to_update_related_post_markup', 1 );
function action_to_update_related_post_markup() {
	$related_post_markup_instance = new Astra_Related_Posts_Markup();
	add_action( 'comment_form_after', array( $related_post_markup_instance, 'astra_get_related_posts' ), 10 );
}

If you don’t have your Child Theme installed, please check this article on how to do it. 
If you are not sure how to add this code, please check this article.

Astra Global Colors In Elementor

When designing your website, you will notice that both Elemetor and Astra global colors will be available in color settings. 

Sometimes, this can be confusing. Also, you might want to limit user rolls with Elementor access to using only Elementor Global Colors.

How To Remove This?

To disable Astra global colors in Elementor, you need to add a filter. You can add the following custom code to the functions.php file of your Child Theme:

# Disable Astra Global Colors In Elementor

add_filter( 'astra_disable_global_colors_in_elementor', '__return_true' );

If you don’t have your Child Theme installed, please check this article on how to do it. 

If you are not sure how to add this code, please check this article.

This document will show you the changes we added and how to apply these improvements when you update your theme to 3.7.4.

Gutenberg UI Improvements Overview

We added Gutenberg UI improvements to several blocks as well as the whole Block editor:

• Block layouts
• “Spacer” block;
• “Pullquote” block;
• “File” block;
• Block edit controles;
• Block selection in the editor.

Let’s check out some details for each improvement:

Block layouts

We added layout compatibility for multiple blocks. The block layout now provides the following options:

• Default Layout – a default boxed layout;
• Wide Layout – this layout will inherit the width of the container you set on your website;
• Full-width Layout – this layout will go edge-to-edge of the screen.

This layout is available for Group, Cover, Columns, Heading, and Media & Text blocks. This structure is available for these blocks even when they are nested. Check out this visual representation of improvement:

This improvement works both for the block editor and front end.

Spacer Block

The Spacer blocks were previously hard to notice. You would notice this block only when you clicked on it. Otherwise, the block stayed almost hidden.

We made the block improvements by adding a light background and by displaying its assigned height.

Pullquote Block

We added a quote icon for the Pullquote block both in the editor and in the front end. This is how the Pullquote Block looked like previously:

The improvements make the block more visible and emphasize that the block content is a quote.

File Block

Previously the File block didn’t have Style support which was improved in the mentioned update.

The style support is now available in the editor and the front-end as well.

Block Edit Controls

In previous versions, the block controls had a lighter color making them less visible.

The block edit controls are more visible now, as we gave them a darker color.

Block Selection

Before improvements, it was not easy to tell what space is some block taking and where to click to start editing it.

The improvement now allows you to see each block and its borders by simply hovering over it with a mouse.

How To Get These Impovements?

For all new websites, Gutenberg UI improvements will be applied automatically when the theme is updated. 

As these improvements can reflect on the front end, you’ll need to activate changes by adding a filter for existing websites. This way, you can check how these changes apply to your website and make any adjustments if needed. 

To apply the improvements to your website, add the following filter to the functions.php file of your Child Theme:

// Filter to enable Astra 3.7.4 Gutenberg UI improvements
add_filter( 'astra_get_option_improve-gb-editor-ui', '__return_true' );

If you don’t have your Child Theme installed, please check this article on how to do it.

If you are not sure how to add this code, please check this article.

Therefore, this document will help you replace these hooks on your website. Please use the lists below to update your code.

Deprecated Astra Hooks and Their Replacements

In short, further down, you will find lists of functions, filters, and actions. Accordingly, please update hooks if you added any filters, actions, or other functions to your website.

Astra Theme 3.7.4 and Astra Pro 3.6.2 versions are still compatible with old codes to avoid any issues. Although your website will still work well after the update, you should replace deprecated hooks with the replacements below.

Further, to help you with these updates, we added backend notifications:

Hence, you can do this by replacing deprecated hooks in your code with the replacements from the lists. This way, your website will remain fully functional and compatible with future updates.

This document will help you do this with the Astra Theme.

Why Is This Important?

This improvement came with the Astra Theme 3.6.9 update. In earlier versions of the Astra Theme setting the font size to zero was not possible.

This will ultimately help you with responsive design.

How To Change This?

For all new websites, these changes will be applied automatically. 

For the existing websites, this improvement needs to be activated by adding a filter. This was done to allow you to check how these changes apply to your website and make any changes if needed. 

To enable this improvement, you need to add the following custom code (filter) to the functions.php file of your Child Theme:

add_filter( 'astra_zero_font_size_case', '__return_true' );

If you don’t have your Child Theme installed, please check this article on how to do it. 
If you are not sure how to add this code, please check this article.

This document will help you remove underlined links on specific classes and buttons. 

Why Is This Important?

The Underline Content Links option allows you to accent all links on your website with just one click. You can find this option in the Customizer, under Global > Typography > Base Typography. Activating this option automatically adds underline text-decoration to your links.

At the same time, some page builder buttons or anchors don’t have an option for overriding the text-decoration. This can interfere with your design and influence the user experience on parts of your website. 

Thus, this document provides two codes that will help you remove the underline text-decoration on certain classes and buttons while keeping the “Underline Content Links” option active for the rest of your website.

How To Change This?

The two available codes will let you remove the underline setting for anchor links or remove it from just some specific elements.

To do this, you need to add one of the following custom codes to the functions.php file of your Child Theme.

If you don’t have your Child Theme installed, please check this article on how to do it. 

If you are not sure how to add this code, please check this article.

1. Code To Remove the Underline Settings for Following Custom Anchor Links:

add_filter( 'astra_unset_builder_elements_underline', '__return_true' );

2. Exclude Specific Anchor Links From Underline Settings:

add_filter( 'astra_remove_underline_anchor_links', 'update_selectors_to_remove_underline', 10, 1 );

function update_selectors_to_remove_underline( $selectors ) {

$selectors = $selectors . ', a.my-first-anchor-tag, a.my-second-anchor-tag'; 

//.my-first-anchor-tag is an example class assigned to anchor link - add your selectors in this manner.

return $selectors;

}

You need to update the above code by replacing the example selectors with the ones from which you want to remove the text-decoration. 

To create your selectors add “a.” in front of the class name you wish to exclude from the underline setting. For example, if your element’s class is “test”, the selector for these elements would be “a.test”

Though it’s a great feature, some users might still need this to be reverted to the previous widget editor. You can disable Astra’s Block Editor support for widgets by using a custom code provided in this document. Let’s show you how to do it.

Why Did This Happen?

WordPress version 5.8 came with a large number of improvements and changes, making a large leap forward for both WordPress and its Block Editor.

Using the Block Editor to manage Widget areas makes it easier to add different blocks to any widget area without coding or using shortcodes.

Having that Astra is fully compatible with this change, you’ll be able to use blocks directly with Astra Customizer options too, including the Header and Footer Builder.

How To Change This?

If for any reason you need to revert this to the previous Widget editor, you can disable Astra’s block editor support for widgets by adding a custom code.

You can add the following custom code to the functions.php file of your Child Theme:

add_action( 'after_setup_theme', 'astra_remove_theme_support' );
function astra_remove_theme_support() {
remove_theme_support( 'widgets-block-editor' );
}

If you don’t have your Child Theme installed, please check this article on how to do it. 
If you are not sure how to add this code, please check this article.

Astra Theme version 3.6.7 came with the fix for this, but the fix is not applied automatically to existing websites. Learn how to apply it to your website.

Why Do I Need This Improvement?

The additional spacing was created as a result of the Astra theme’s CSS for the default “ul” tag. The tag was affecting Elementor Pro’s TOC widget. 

You can check the following example:

• This is the Elementor Pro TOC widget with Hello Elementor theme:

• And here, you can see how the same widget look when used with the Astra Theme:

Though Astra 3.6.7 update fixes this issue, it won’t be applied automatically to your website to avoid unwanted effects on your existing websites.

How To Fix This?

For all new websites, this fix will be applied automatically when the theme is updated. 

As mentioned, for the existing website, this improvement needs to be activated by adding a filter. This was done to allow you to check how these changes apply to your website and make any changes if needed. 

To apply the improvement to your existing website, you would need to add a filter to the functions.php file of your Child Theme. If you don’t have your Child Theme installed, please check this article on how to do it. Please add the following filter:

add_filter( 'astra_remove_elementor_toc_margin', '__return_true' );

If you are not sure how to add this code, please check this article.

Why Do I Need This Improvement?

Previously, the theme default button padding values were 10px on top and bottom and 40px on the left and right sides. These settings negatively influenced the visual appeal of the buttons as they made buttons too wide.

That’s why we updated these values to 15-30px (top, bottom – right, left).

Also, if you used Gutenberg for your posts or pages, you might have noticed that the button padding values you set at Customizer > Global > Buttons didn’t apply and that you needed to set these values manually for each button.

Though these things were changed with Astra 3.6.3 update, this won’t be applied automatically to your website to avoid any adverse effects on your existing websites.

How To Fix This?

For all new websites, these changes will be applied automatically. 

As mentioned, for the existing website, this improvement needs to be activated by adding a filter. This was done to allow you to check how these changes apply to your website and make any changes if needed. 

To apply the improvement to your existing website, you would need to add a filter to the functions.php file of your Child Theme. If you don’t have your Child Theme installed, please check this article on how to do it. Please add the following filter:

add_filter( 'astra_update_button_padding_defaults', '__return_true' );

If you are not sure how to add this code, please check this article.

Why Would I Have a Need To Hide These Settings?

Meta settings are handy for additional customization of a specific page or post that needs to be different from the rest of your website. But, on the other hand, this can impact the design and even disturb the functioning of your website (for example, Disabling Primary Header on Homepage). 

If your website has a more significant number of users with different user roles, or you’re giving access to outside service providers, these users would probably require access to your content on all or some pages or posts. At the same time, they would typically have access to the meta settings too. Thus, your website might require limiting access to Astra’s Meta Settings for specific user roles while still allowing them access to pages or posts content. This might be a security measure or just the prevention of accidental issues with a website design and functions.

How To Do This?

Achieving this would require adding in a little bit of custom code to your website. Please follow these steps:

Step 1 – Check your User Roles and the exact names of the User Roles you would like to limit. WordPress comes with some default user roles:

• Super Administrator
• Administrator
• Editor
• Author
• Contributor
• Subscriber

Also, some plugins could add additional User Roles to this list. You can check your Users and User Roles at Dashboard > Users.

Step 2 – Add the following filter to the functions.php file of your Child Theme:

add_action( 'do_meta_boxes', 'ast_remove_plugin_metaboxes' );

/**
* Remove Astra settings meta box for users that are not administrators
*/
function ast_remove_plugin_metaboxes(){
    if ( ! current_user_can( 'administrator' ) ) {
        remove_meta_box( 'astra_settings_meta_box', 'page', 'side' ); // Remove Astra Settings in Pages
        remove_meta_box( 'astra_settings_meta_box', 'post', 'side' ); // Remove Astra Settings in Posts
    }
}

The code mentioned above will be applied to the user roles lower than the Administrator user role – to apply this to different user roles, you can change the bolded role name “administrator” to any user role you wish. This will limit access to Astra’s Meta Settings for all lower roles that the one set in the code. For example, if we would want to set this limit to lower roles than Editor, this line of the code would look like this:

if ( ! current_user_can( 'editor' ) ) {

This change will now allow access to Astra’s Meta Settings to Administrators and Editors but limit it for all other (lower) roles.

Also, the code above will hide Astra Settings on both pages and posts. If you wish to, for example, leave access to these settings in Posts but hide it on Pages for a specific user role, you can do this by removing the line of code related to Posts:

remove_meta_box( 'astra_settings_meta_box', 'post', 'side' ); // Remove Astra Settings in Posts

If you don’t have your Child Theme installed, please check this article on how to do it.
If you are not sure how to add this code, please check this article.