You are a Professional blogger or web developer then you may need a Open/Close key as it allows you to demonstrate or cover up some details behind your button.This button can really be very helpful when you are working to design a simple quiz. The spoiler has the function to hide and show text or images, and is very useful when trying to reduce space in the information or only if you want the picture or written text only see when pushed. This effect shows a button with written text, clicking it will expand the content and on clicking it again will hide the content. It uses a simple script and you can use it anywhere. You can hide whatever you want an image, code, written text etc. This key can be a lot beneficial and preserve your material from spammers, copy machines etc. This key is made from CSS and HTML. In this Totorial Today I will show you how to Add Open/Close Button to Blogger.
Features:
- You can hide files like images, codes, audio files, upload links.
- Change the text Open/Close to your desired choice.
Add Open/Close Button to Blogger
Step 1. Sign in to blogger dashboard.
Step 2. Go to HTML tab in the post editor.
Step 3. Add the below code.
<div id="spoiler" style="display: none;">
ADD HIDDEN CONTENT.</div>
<button onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}" title="Click to show/hide" type="button">Open/Close</button>
<br />
Step 4. Customize
- Change Open/Close with the text you want to appear on button.
- Change ADD HIDDEN CONTENT. with the content you want to hide the Open/Close button.
Step 5. Now Save Post and you are done.
*****Happy Blogging*****
