Split pagelist widget into two columns in blogger

How to split pagelist widget into 2 in Blogger:

Like splitting Blogger header into two sections, we can also split pagelist widget into 2 columns or sections. By splitting pagelist widget we can add gadget side to the pagelist gadget on blogger blog. By spitting pagelist we can easily move pages to right or left side.

Follow below steps to split pagelist widget into 2 in Blogger

Step 1 : Go to Blogger Dashboard

Step 2 : Click on Template

Step 3 : Click on Edit html

Step 4 : Do change like below

search below code
<b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes'>
<b:widget id='PageList1' locked='false' title='' type='PageList'>
</b:section>
add below code just after above code

<b:section id='crosscol-right' showaddelement='yes'/>
<div style='clear: both;'/>

Again search ]]></b:skin>  , and add below code just above  ]]></b:skin>


#crosscol, body#layout #crosscol {width:45%;display:inline-block;float:left;}
#crosscol-right, body#layout #crosscol-right {width:45%;display:inline-block;float:right;padding:15px;}
#crosscol-right .widget {margin:0;}


And again add below code just above  ]]>   </b:template-skin>

#layout #crosscol {width: 50%; float: left;}
#layout #crosscol-right {width: 50%; float: right;}

Step 5 : Click on Save template.

3 comments:

  1. You really need to add the ability to copy and paste to this page. I realize a lot of people disable right click but it sucks to have to type the whole code when you could simply copy and paste. :/

    ReplyDelete
  2. I implemented the code and the pageList column was smaller but when I went to Layout, I was not able to drag a widget to the right of pageList. Do I have to add a widget to the right with code or should I be able to drag and drop one there? And yes, please allow copy and paste.

    ReplyDelete