.png)
Introduction
Hi guys, welcome to my blog Blogging Doses and I am Sohil. In today's article we will understand what is FAQ, why it is useful and why it is important to implement this, all these things we will explain to you in today's article.
Are you seeking to rank in Google first page, and want to capture more space in google search page and want High CTR ?
If Yes
Then you have to read our today's article on FAQ schema and all that implementation stuff you have to wait till end. Let's start it.
What is the FAQ schema ?
 |
| Credit: bloggingdoses.xyz |
The Frequently Asked Question (FAQ) page contains a rundown of inquiries and answers relating to a specific niche. Appropriately increased FAQ pages might be qualified to have a rich outcome on Search and an Action on the Google Assistant, which can assist your site with arriving at the right clients.
FAQ schema is a specialised markup you could upload to a webpage’s code that carries a listing of questions and answers. Google then reads this markup and makes use of it to generate a rich snippet.
This FAQ rich snippet indicates a collapsible listing below your normal SERP result. When a query is clicked, the solution is found out in a dropdown. If your markup carries greater than 4 questions, a “Show more” hyperlink may be proven so one can see all of your FAQ markup.
How does the FAQ schema help in SEO ?
1: Improve CTR
While FAQpage pattern information markup is useful to clients, it likewise helps Google. It further develops the crawling system, which can prompt more exact ordering. This can get your substance before a more pertinent crowd, expanding your likely CTR.
One contextual analysis saw a more than half expansion in their CTR in the wake of executing the FAQ pattern. That is sufficient to make even the most grouchy of statisticians grin.
2: Eligible Voice search results
Mostly the voice search results are taken from the rich results. Frequently asked questions (FAQ) page's very beneficial for Google Assistant, Alexa and Siri to give answers exactly to the users.
If you wrote your questions and answers in the correct format then eventually the results we take from your FAQ. This is when people directly ask questions to AI like Google assistant.
3: Greater visibility
By applying the FAQ schema helps the crawler to better understand the content and present rich results on the search page. It helps in greater visibility in search pages because it captures more space in search results and also increases the CTR.
Now we have enough knowledge of FAQ schema and their uses, Now let's start to implement the Schema.
How to add FAQ schema in blogger blog posts ?
Step 1: Generating FAQ schema
First go to the FAQ page JSON-LD Schema Generator (preferred by Google). See below image to understand better.
Step 2: Adding FAQ schema in blog post
Now add your questions & answers and click on' Copy FAQ schema ' and paste this Schema code just below the </div> tag in the HTML place of blogger that is shown below IMG.
Step 3: Now validating FAQ schema
Now you can validate whether the FAQ schema is implemented correctly or not by using Google's tool name Rich Results Testing Tool.
Paste that FAQ schema code that you had generated, in the code input section or you paste the link of the post in which you had added the Schema markup and after loading it will automatically show you if the Page is eligible for Rich Results or not.
You can likewise actually take a look at the review of this FAQ schema. It will show a test review of the page in the query output. So you will find out about it.
Now notify google to crawl it
Presently you have included the schema data of your blogger site. The time has come to advise Google to refresh its ordering to show the rich outcome.
Go to Google Search Console and snap on the URL examination instrument. Presently glue the blog entry URL and hit the Request Indexing button.
Presently it will ping Google to refresh the ordering and in the event that your site positions on the SERPS, the possibilities showing FAQs are higher.
How to add a stylish FAQ schema in a blogger blog post ?
By following the above steps you have successfully added FAQ schema in blogger post but the FAQ schama will not be visible in post because it is JSON LD. If you want to show a drop-down FAQ schama then you have to follow the below steps.
Step 1: First of all Login to your Blogger Dashboard.
Step 2: On Blogger Dashboard, click Theme section.
Step 3: Click the arrow down icon 🔻 next to 'customize' button.
Note: before editing your code please take an backup if you done any mistake then you can recover your template
Step 4: Click on Edit HTML, you will be redirected to the editing page.
Step 5: Now search the code ]]></b:skin> and paste the below given CSS Codes just above to it.
/* Accordion by Fineshop */
.acdn{position:relative;list-style:none;margin:30px 0;padding:0;font-size:14px;line-height:1.7em;font-family:inherit}
.acdn .ac{width:100%;padding:20px 0 20px 15px;margin:10px 0;background:#f0f0ff;border-radius:10px;border-left:4px solid #8a8aff;box-shadow:0 5px 10px rgba(51,51,51,.1)}
.acdn .ac:nth-child(4n + 1){background:#f0f0ff;border-left-color:#8a8aff}
.acdn .ac:nth-child(4n + 2){background:#fff0f3;border-left-color:#ff8aa1}
.acdn .ac:nth-child(4n + 3){background:#f0faff;border-left-color:#8ad8ff}
.acdn .ac:nth-child(4n + 4){background:#fff7f0;border-left-color:#ffc08a}
.acdn .cont{margin:0;padding-left:27px;padding-right:27px;position:relative;overflow:hidden;max-height:0;transition:all .3s ease;color:#08102b}
.acdn .cont ul, .acdn .cont ol{padding-left:13px}
.acdn .cont li{padding:0}
.acdn .cont a{text-decoration:none;color:#08102b}
.acdn .cont a:hover{text-decoration:underline}
.acdn p:first-child{margin-top:0}
.acdn p:last-child{margin-bottom:0}
.acTtl{display:flex;align-items:center;font-weight:700;color:#08102b}
.acTtl span{display:flex;flex-grow:1}
.acTtl span:before{content:'';padding-left:15px}
.acIcn{flex-shrink:0;display:flex;align-items:center;width:12px;height:12px;position:relative}
.acIcn:before, .acIcn:after{content:'';display:block;width:100%;height:2px;border-radius:2px;background:#08102b}
.acIcn:after{position:absolute;transform:rotate(90deg)}
.acMn{display:none}
.acMn:checked ~ .acTtl .acIcn:after{visibility:hidden;opacity:0}
.acMn:checked ~ .cont{max-height:100vh;padding-top:15px;padding-bottom:8px}
.darkMode .acdn .ac{background:#252526;border-left-color:#4c4c4e}
.darkMode .acdn .cont, .darkMode .acdn .cont a, .darkMode .acTtl, .darkMode .acMn:checked ~ .acTtl{color:#fefefe}
.darkMode .acTtl .acIcn:before, .darkMode .acTtl .acIcn:after, .darkMode .acMn:checked ~ .acTtl .acIcn:before, .darkMode .acMn:checked ~ .acTtl .acIcn:after{background:#fefefe}Step 6: You had placed the CSS code properly. Now if you want to show the stylish FAQ schema then you have to paste the below code in the HTML section of the post.
<!--[ Accordion by Fineshop ]-->
<div class='acdn'>
<!--[ Accordion 1 ]-->
<div class='ac'>
<div class='acCont'>
<input class='acMn' id='offaccor1' name='accordion-1' type='checkbox'/>
<label class='acTtl' for='offaccor1'>
<i class='acIcn'></i>
<!--[ Accordion Title ]-->
<span>Question</span>
</label>
<!--[ Accordion Content ]-->
<div class='cont'>
<p>Answer</p>
</div>
</div>
</div>
<!--[ Accordion 2 ]-->
<div class='ac'>
<div class='acCont'>
<input class='acMn' id='offaccor2' name='accordion-2' type='checkbox'/>
<label class='acTtl' for='offaccor2'>
<i class='acIcn'></i>
<!--[ Accordion Title ]-->
<span>Question</span>
</label>
<!--[ Accordion Content ]-->
<div class='cont'>
<p>Answer</p>
</div>
</div>
</div>
<!--[ Accordion 3 ]-->
<div class='ac'>
<div class='acCont'>
<input class='acMn' id='offaccor3' name='accordion-3' type='checkbox'/>
<label class='acTtl' for='offaccor3'>
<i class='acIcn'></i>
<!--[ Accordion Title ]-->
<span>Question</span>
</label>
<!--[ Accordion Content ]-->
<div class='cont'>
<p>Answer</p>
</div>
</div>
</div>
<!--[ Accordion 4 ]-->
<div class='ac'>
<div class='acCont'>
<input class='acMn' id='offaccor4' name='accordion-4' type='checkbox'/>
<label class='acTtl' for='offaccor4'>
<i class='acIcn'></i>
<!--[ Accordion Title ]-->
<span>Question</span>
</label>
<!--[ Accordion Content ]-->
<div class='cont'>
<p>Answer</p>
</div>
</div>
</div>
</div>You can see the FAQ schema in below (Demo) 🔴
FAQ organized information is a code that you can carry out to your site's FAQs to improve their probability of positioning as a SERP rich outcome and as a voice output inside Google Assistant.
On the off chance that you are searching for a simple technique for further developing your site's SEO, utilizing the FAQ Schema Markup is an extraordinary spot to begin. FAQ pages, appropriately increased, are generally qualified to become rich outcomes in Google's search.
The contextual investigation: How might FAQ scraps at any point assist with further developing CTR? For the situation investigation of my organization's site, I utilized FAQ Schema on one presentation page. I nearly multiplied the CTR from 1.82% to 2.75% (51% inspire) in under 90 days.
FAQs empower you to manage explicit inquiries that your clients have about your business. They likewise address one more method for connecting and associate with your ideal interest group. Hence, it is one of the main components of your site methodology.
Conclusion
If you understand our today's article perfectly and implemented exactly then the FAQ schema will work fine. If you have any questions related to FAQ you can comment below
Accordation:
https://www.fineshopdesign.com/