Thursday, September 29, 2011

Disable Certain Dynamic Views in Blogger


So you can set your homepage to show one of the 7 Dynamic Views by default. The problem is, your blog might look good in some other views, and let's just say you don't want your readers to see your blog in some of the other dynamic views. And the black bar at the top of your blog offering your readers to choose their own dynamic view isn't exactly helping your blog to maintain its consistency. In this tutorial, I'm gonna show you how you can shave off some of these other view options from the black bar - so that your readers will be stuck with what you want them to see - unless of course if your readers know the URL trick, or if they use Internet Explorer.

Step 1: 

If you're using the old Blogger interface: Go to Dashboard - Design - Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

If you're using the new Blogger interface: Go to Dashboard ('House' symbol) - Template - Customize - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.
#Classic.ss, #views ul li:first-child , 
#Flipcard.ss, #views ul li:nth-child(2),
#Magazine.ss, #views ul li:nth-child(3),
#Mosaic.ss, #views ul li:nth-child(4),
#Sidebar.ss, #views ul li:nth-child(5),
#Snapsnot.ss, #views ul li:nth-child(6),
#Timeslide.ss, #views ul li:nth-child(7)
{
display: none !important;
}

Step 2: 

Now, time to shave things off. Remove any line from the code given in Step 1, if you want the corresponding Dynamic View to show.

For example, if I want my readers to see only 'Flipcard' and 'Mosaic' dynamic views, I'd remove the lines that say 'Flipcard' and 'Mosaic' from my Template Designer. So the code will look like this:
#Classic.ss, #views ul li:first-child , 

#Magazine.ss, #views ul li:nth-child(3),

#Sidebar.ss, #views ul li:nth-child(5),
#Snapsnot.ss, #views ul li:nth-child(6),
#Timeslide.ss, #views ul li:nth-child(7)
{
display: none !important;
}
There's only one rule to the trick above. Pay Attention. Whatever you remove, make sure the very last option doesn't end with a comma.

If you see the example I've given above, all the views has a comma (,) at the end of the line, except for the last one - 'Timeslide'. If you decide to remove the 'Timeslide' line, make sure you remove the comma from the line above, like this:
#Classic.ss, #views ul li:first-child , 
#Flipcard.ss, #views ul li:nth-child(2),
#Magazine.ss, #views ul li:nth-child(3),
#Mosaic.ss, #views ul li:nth-child(4),
#Sidebar.ss, #views ul li:nth-child(5)
{
display: none !important;
}
See how the last line above does not end with a comma? I've highlighted this line to make it easier for you to see. Again, just one rule. Make sure the last dynamic view in the list above does not end with a comma. Just remove the comma, if there is any. All other preceding views must end with a comma.

Extra:

1) To get rid of the whole menu/link of choices, add the following to your CSS:
#views{
display: none !important;
}

#header #pages, #header #pages:before{
border-left: 0px !important;
}

2) Reader Jeff Custodio came up with a brilliant idea to prevent your viewers from performing the URL trick, by redirecting any '/view/template' URL to your main page. See his comment here.

Note: To perform redirection, go to Dashboard - Settings - Custom Redirects

That's all folks. Don't be asking me why it won't work in Internet Explorer - I can't answer that question without being sarcastic.

Elm0D

Author & Editor

Has laoreet percipitur ad. Vide interesset in mei, no his legimus verterem. Et nostrum imperdiet appellantur usu, mnesarchum referrentur id vim.

0 comments:

Post a Comment

Navigate» Become author for this Blog

Manual Categories