How to create such blocks



Can someone share how can i create such blocks
Reference:
https://petlifetoday.com/best-guinea-pig-cages/

For such Highlights type table’s. I use shortcode ultimate plugin.

But, I can give a demo code for you to look like this. Which you can set a custom shortcode to load this.

any demo for this one available?
@AbhishekVerma

Yes. On my blog, it is available.
Check this post :

2 Likes

please share some shortcodes

All shortcodes will be available on the editor when you install the plugin “Shortcode Ultimate”

5 Likes

Hey bro can you edit this shortcode

[su_box title="Key features" style="default" box_color="#333333" title_color="#FFFFFF" radius="3" class=""][su_list icon=paw"" icon_color="#333333" indent="0" class=""]<ul>
<li>Sturdy and quality material.</li>
<li>It can be expanded and designed as per need and specification.</li>
<li>Cable ties and anti-slip pieces open door for a lot of design possibilities.</li>
<li>Can house a lot more guinea pigs in it.</li>
<li>Very cost efficient setup for the size and quality being offered.</li>
</ul>[/su_list][/su_box]

And tell me what i can add there to change my icons as ticks and exclamation as in the picture right now it is star as you can see
@AbhishekVerma
@GulshanKumar

Use FontAwesome and add <i class="fa fa-tick"/> in front of every point

2 Likes
[su_box title="Key features" style="default" box_color="#333333" title_color="#FFFFFF" radius="3" class=""][su_list icon=paw"" icon_color="#333333" indent="0" class=""]<ul>
<li><i class="fa fa-tick"/> Sturdy and quality material.</li>
<li><i class="fa fa-tick"/> It can be expanded and designed as per need and specification.</li>
<li><i class="fa fa-tick"/> Cable ties and anti-slip pieces open door for a lot of design possibilities.</li>
<li><i class="fa fa-tick"/> Can house a lot more guinea pigs in it.</li>
<li><i class="fa fa-tick"/> Very cost efficient setup for the size and quality being offered.</li>
</ul>[/su_list][/su_box]
1 Like

can you tell me from where did we get that code, how can i get other symbol code as well?

this is not working sir

Looks something wrong… are you using any css and js optimisation plugin?

yes, autoptimise+async js

Consider disabling it first and then try again

Open header.php in theme editor

add the following within code
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

then replace the icon name in the following and add it where you want to show the icon:

<i class="fa fa-tick"/>

You can find the name of icon here : https://fontawesome.com/icons/

can i use header and footer injection plugin or snippet plugin to insert it?
@AbhishekVerma

Okay sir will try that

yes. for the main script you can