Expand/Collapse Text | Blogger | InfoTechBlogging InfoTechBlogging: Expand/Collapse Text | Blogger

Posted by Syed Muhammad Ali


If you are a blogger widget generator and share blogger widgets with others. Then you have to place a long widget code in the Post. You can make this long code Collapse so that visitor may get the code by clicking the Expand Button and the Code will be expanded and displayed to him.

This widget would allow you to hide the long code in the Post and it only appears when the Visitor clicks the Expand Button.

  • Find ]]> By pressing Ctrl+F Key.
  • Paste the Below Code Just Above ]]>

.posthidden {display:none}
.postshown {display:inline}

  • Paste the Below Code Just Above tag.

function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className==”postshown”) { whichpost.className=”posthidden”; } else { whichpost.className=”postshown”; } }

  • Paste the Below Code where you want this widget to appear.

Click to Expand and Collapse

Enter your Code Here

  • Replace  ‘Enter your Code Here’ the Code you want to Hide.
  • Replace ‘Expand and Collapse’ with the Text you would Like your Visitor to see.

Congrats! You are Done. I hope this widget has helped you. Like our Fb Page to Support us

Follow Us!

About This Blog:
InfoTechBlogging is owned by Syed Muhammad.Ali who loves to help other bloggers in starting their Blogging career. He also share Blogger Widgets and Templates.
Follow Him at : Google |Facebook| Twitter