Web-Design

Context-Sensitive Sidebars: Stay Lean

Slim-Down Symbol Picture

We need side­bars. For this, we have already made room. But we need dif­fer­ent side­bars. Pre­sent­ing the tag cloud makes sense only on the side­bar of the search page. There it can short­en the search in the set of arti­cles. On the oth­er pages, it dis­tracts the read­er. Con­verse­ly, the oth­er pages need a ‘more’ but­ton in the side­bar that leads to the sur­vey page. In oth­er words, we need con­text-sen­si­tive side­bars — anoth­er means to focus:

[ en | de ]

Solution

  • Design­ing the side­bar for the post-sur­vey page:
    • Install the plu­g­in ‘Cus­tom Side­bars’ via the Word­Press Back­end.
    • Open Appearance/Widgets and cre­ate a sec­ond side­bar myplp.
    • Add a text field to the wid­get myplp con­tain­ing the mes­sages addressed to the users of the search page.
    • Add a Cool Tag Cloud instance to the wid­get myplp as you did it for the stan­dard side­bar
    • In the wid­get myplp, assign Side­bar Location/For Archives/As Side­bar for select­ed Archive Types/ to Post Index
  • Design­ing the gen­er­al default side­bar for all oth­er pages:
    • Select any new more-image and load it up into the media library.
    • Add an image field to the stan­dard default side­bar now called theme side­bar
    • Insert the uploaded image into that field and link it to the page https://yourdomain/myplp

Background

What’s the effect? The default side­bar is dis­played on all pages, except on your post list page. Thus, your read­er can reach the sur­vey page with one click. And the tag cloud, by which you can eas­i­ly get clus­tered sub-lists, is only dis­played on the post-sur­vey page.

Good to know is, that Cus­tom Side­bars is Open-Source soft­ware. Its repos­i­to­ry con­tains a GPL‑2.0 license and the respec­tive readme.txt con­tains a GPL‑2.0 licens­ing state­ment.


And how does this …

… sup­port our migra­tion to bootScore? Well When the web design­er has com­plet­ed her work on good illus­tra­tions, she can relax and inte­grate tags and clouds into her site, improve her overview page and design her own land­ing page. Whether the result­ing full­ness real­ly ben­e­fits her own read­er, whether it can become slim­mer and how, whether more dis­creet ref­er­ences and spe­cif­ic fonts also increase the read­abil­i­ty, all this she should nev­er­the­less con­sid­er while imple­ment­ing these fea­tures. This post sup­ports these steps towards a per­son­al­ized bootScore site.


Leave a Comment

Your email address will not be published. Required fields are marked *

To top