Health

[Health][bleft]

Technology

[Technology][bsummary]

Business

[Business][twocolumns]

HTML Code With 5 FAQs Included in a Beautiful Format Using Bootstrap





Many people need FAQs for their website. FAQs help visitors to know information about specific topics and they also help site ranking on Google. So I provide a custom FAQ format for you. You can add a table in this custom code of the first box at the end of the FAQ section. This design is specially created for smartphone review websites but you can use this custom code for your regular website too.


1st box:


<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Samsung Galaxy Phone Specifications</title><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"><style>.table td,.table th{padding:.75rem;vertical-align:middle}.faq-section{background-color:#f8f9fa;padding:2rem;border-radius:.5rem}</style></head><body><div class="container my-5"><h1 class="text-center mb-4">Samsung Galaxy Phone Specifications</h1><div class="table-responsive"><table class="table table-bordered"><thead><tr><th colspan="2" class="text-center"><span style="font-size:large">Samsung Galaxy Phone Specification</span></th></tr></thead><tbody></tbody></table></div>



2nd box:


<div class="faq-section mt-5"><h2 class="text-center mb-4">Frequently Asked Questions</h2><div class="accordion" id="faqAccordion"><div class="card"><div class="card-header" id="faqHeading1"><h5 class="mb-0"><button class="btn btn-link" type="button" data-toggle="collapse" data-target="#faqCollapse1" aria-expanded="true" aria-controls="faqCollapse1">What is the screen resolution of this phone?</button></h5></div><div id="faqCollapse1" class="collapse show" aria-labelledby="faqHeading1" data-parent="#faqAccordion"><div class="card-body">The screen resolution of this Samsung Galaxy phone is 720 x 1280 pixels (~312 ppi pixel density).</div></div></div><div class="card"><div class="card-header" id="faqHeading2"><h5 class="mb-0"><button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#faqCollapse2" aria-expanded="false" aria-controls="faqCollapse2">What is the battery capacity?</button></h5></div><div id="faqCollapse2" class="collapse" aria-labelledby="faqHeading2" data-parent="#faqAccordion"><div class="card-body">The battery capacity of this Samsung Galaxy phone is 3000 mAh (removable Li-Ion battery).</div></div></div><div class="card"><div class="card-header" id="faqHeading3"><h5 class="mb-0"><button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#faqCollapse3" aria-expanded="false" aria-controls="faqCollapse3">Does it support 4G LTE?</button></h5></div><div id="faqCollapse3" class="collapse" aria-labelledby="faqHeading3" data-parent="#faqAccordion"><div class="card-body">Yes, this Samsung Galaxy phone supports 4G LTE bands 1(2100), 3(1800), 7(2600), 38(2600), 39(1900), 40(2300), and 41(2500) for the SM-J7008 model.</div></div></div><div class="card"><div class="card-header" id="faqHeading4"><h5 class="mb-0"><button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#faqCollapse4" aria-expanded="false" aria-controls="faqCollapse4">What is the processor and chipset used in this phone?</button></h5></div><div id="faqCollapse4" class="collapse" aria-labelledby="faqHeading4" data-parent="#faqAccordion"><div class="card-body">This Samsung Galaxy phone is powered by a Quad-core 1.5 GHz Cortex-A53 processor and a Qualcomm MSM8916 Snapdragon 410 chipset.</div></div></div><div class="card"><div class="card-header" id="faqHeading5"><h5 class="mb-0"><button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#faqCollapse5" aria-expanded="false" aria-controls="faqCollapse5">What are the available color options?</button></h5></div><div id="faqCollapse5" class="collapse" aria-labelledby="faqHeading5" data-parent="#faqAccordion"><div class="card-body">This Samsung Galaxy phone is available in three color options: White, Black, and Gold.</div></div></div></div></div>



3rd box:


<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.min.js"></script><script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>





Preview of FAQ



In conclusion copy all the code and paste it into your notepad then save that in .”html or .htm” format. Now it's time to open the file and see the actual structure in your browser. Good luck.






No comments: