Below, you’ll find a detailed guide on how to add the Svg Flags Lite Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Svg Flags Lite Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Svg Flags Lite Plugin and the shortcodes it provides:
"SVG Flags Lite is a unique plugin that offers beautiful scalable flags for all countries. Perfect for adding a global touch to your WordPress site!"
- [svg-flag-grid]
- [svg-flag-image]
- [svg-flags]
Svg Flags Lite [svg-flag-grid] Shortcode
The svg-flags-lite plugin shortcode, ‘svg-flag-grid’, is designed to render a grid of SVG flags. It takes in attributes, and if any are specified, it sets ‘gutenberg_block’ to false. This function returns the rendered SVG flag grid, providing a visually appealing display of flags on your WordPress site.
Shortcode: [svg-flag-grid]
Examples and Usage
Basic example – Show a grid of SVG flags without any specific attributes. The plugin will use its default settings for the grid display.
[svg-flag-grid /]PHP Function Code
In case you have difficulties debugging what causing issues with [svg-flag-grid] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('svg-flag-grid', array(&$this, 'render_svg_flag_grid_shortcode'));Shortcode PHP function:
function render_svg_flag_grid_shortcode($attributes)
{
// if any shortcode attributes specified then manually set 'gutenberg_block' this to false in case it has been set to true
if( is_array($attributes) ) {
$attributes['gutenberg_block'] = false;
}
return $this->render_svg_flag_grid($attributes);
}
Code file location:
svg-flags-lite/svg-flags-lite/classes/shortcodes/svg-flag-grid-shortcode.phpSvg Flags Lite [svg-flag-image] Shortcode
The SVG-Flags-Lite plugin shortcode ‘svg-flag-image’ is used to render SVG flag images on your website. It accepts various attributes to customize the flag display. The PHP function ‘render_svg_flag_image_shortcode’ checks if any attributes are specified. If so, it sets ‘gutenberg_block’ to false, ensuring compatibility with Gutenberg editor. It then calls the ‘render_svg_flag_image’ function to display the flag image.
Shortcode: [svg-flag-image]
Examples and Usage
Basic example – A simple usage of the svg-flag-image shortcode to render a flag image.
[svg-flag-image id="us" /]Advanced examples
Using the svg-flag-image shortcode to render a flag image with specific height and width. The flag image will be displayed according to the specified dimensions.
[svg-flag-image id="us" height="50px" width="100px" /]Using the svg-flag-image shortcode to render a flag image with a custom class. The flag image will be displayed with the specified class, allowing for additional styling and customization.
[svg-flag-image id="us" class="custom-flag" /]Using the svg-flag-image shortcode to render a flag image with a custom alt text. The flag image will be displayed with the specified alt text, improving accessibility and SEO.
[svg-flag-image id="us" alt="United States Flag" /]PHP Function Code
In case you have difficulties debugging what causing issues with [svg-flag-image] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('svg-flag-image', array(&$this, 'render_svg_flag_image_shortcode'));Shortcode PHP function:
function render_svg_flag_image_shortcode($attributes)
{
// if any shortcode attributes specified then manually set 'gutenberg_block' this to false in case it has been set to true
if( is_array($attributes) ) {
$attributes['gutenberg_block'] = false;
}
return $this->render_svg_flag_image($attributes);
}
Code file location:
svg-flags-lite/svg-flags-lite/classes/shortcodes/svg-flag-image-shortcode.phpSvg Flags Lite [svg-flags] Shortcode
The svg-flags-lite plugin shortcode is designed to render SVG flags on your website. It operates by checking if any attributes are specified in the shortcode. If so, it sets ‘gutenberg_block’ to false, ensuring it doesn’t interfere with the Gutenberg editor.
Shortcode: [svg-flags]
Examples and Usage
Basic example – Showcases a simple usage of the ‘svg-flags’ shortcode without any attributes.
[svg-flags /]Advanced examples
Utilizing the shortcode to display a specific flag by referencing its country code. The flag will be rendered based on the country code provided.
[svg-flags country_code="us" /]Employing the shortcode to display a flag with a specific size. The size attribute allows you to control the dimensions of the flag.
[svg-flags country_code="us" size="medium" /]Using the shortcode to display a flag with customized attributes. Here, we are displaying the US flag with a medium size and a custom class.
[svg-flags country_code="us" size="medium" class="custom-class" /]PHP Function Code
In case you have difficulties debugging what causing issues with [svg-flags] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('svg-flags', array(&$this, 'render_svg_flag_shortcode'));Shortcode PHP function:
function render_svg_flag_shortcode($attributes)
{
// if any shortcode attributes specified then manually set 'gutenberg_block' this to false in case it has been set to true
if( is_array($attributes) ) {
$attributes['gutenberg_block'] = false;
}
return $this->render_svg_flag($attributes);
}
Code file location:
svg-flags-lite/svg-flags-lite/classes/shortcodes/svg-flag-shortcode.phpConclusion
Now that you’ve learned how to embed the Svg Flags Lite Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply