Southern Listeners

Loading
Thanks to Greenlava for this cool gadget. Get yours here

Friday, September 30, 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.

401 comments:

  1. Perfect !
    Thank you SO MUCH for that !!! :)))))))
    Take a look at the result if you want ;)

    ReplyDelete
  2. @L'Iconoclaste: Looking good! Thanks for the feedback.

    Cheers and God bless.

    ReplyDelete
  3. I quoted this code on my own site, but also added in the following two lines to further clean it up:

    #views {display:none!important;}

    #header #pages::before {border-left: none!important;}

    ReplyDelete
  4. This is exactly what I needed, and your instructions are so easy to follow. Thank you, it's perfect!

    ReplyDelete
  5. @manda.moore: No problem, cheers!

    @Alicia: Glad you found the fix that you've wanted, and thanks for the feedback. Cheers and God bless.

    ReplyDelete
  6. @Bilal: No problem at all :)

    ReplyDelete
  7. thank you so much...This really makes a lot of difference because now i have complete control what and how i want my blog visitors to view my blog..thanks a lot...God Bless

    ReplyDelete
  8. @Timeless Closet: Glad you like the tweak. Cheers and God bless.

    ReplyDelete
  9. Hi.. I've those option in submenu. I applied your code & remove 7 child or submenu items as well.. but main menu item still is there which I choose as template named Sidebar. what is the system to remove that Sidebar menu item. For kind your information I've also a menu or page named Contact & I don't want to loose that. my blog add coporton.blogsp....

    ReplyDelete
  10. @Admin: I don't quite get what you mean. If you remove the black bar, you will lose the link to your 'contact' page. If you want to keep that link, then what exactly do you want to remove?

    ReplyDelete
  11. Thank you SO very much for all of these posts on the new Dynamic view for blogger. Everything you have written, I have wondered for it myself - I really appreciate it!

    ReplyDelete
  12. @j.wade: Glad you find them helpful :) Cheers and God bless.

    ReplyDelete
  13. Your Blog is awesome!

    I have 2 questions:

    In Flipcard mode, there is a submenu that shows the items: "recent", date", "label" and "author",

    I would like to hide or deactivate "author" since everything is by the same author.

    I would also like the default setting to be "label" instead of "recent". If it requires deactivating the other items in this submenu that is fine. Thanks so much in advance!!!

    ReplyDelete
  14. @Jon: It is not possible to set default group view under Flipcard template just as yet. As for hiding the author column, add this to your CSS:

    #groups li:last-child{
    display: none !important;
    }

    Note that it won't work on Internet Explorers. That's just the way it is.

    ReplyDelete
  15. Wow. Thanks for this great info! I'm using the flipcard style for my artwork portfolio, and I'd really like to suppress the post dates from showing on the back of the flip cards. Is that possible?

    ReplyDelete
  16. @Todd: Well, yes. Add this to your CSS:

    .card .back .overlay .date{
    display: none;
    }

    Cheers.

    ReplyDelete
  17. I added CSS code as proposed to YoboY & Todd, but nothing changed. Could it be because I'm using Google Chrome? Or I miss something else?

    [great helping site!!! makes web a friendly territory]

    ReplyDelete
  18. @TNA: I've checked one of your blogs, and it seems like you've got it working:

    http://tnsworks.blogspot.com/

    There are only two visible views now, instead of 7. I hope that was what you were going for. Cheers.

    ReplyDelete
  19. thanks YoboY for your concern!
    yes, i did manage to have 2 views only thanks to your advice;
    however, i cannot get rid of the annoying date & author bits.
    any tip?

    ReplyDelete
  20. @TNS: Add this to your css:

    #groups li:last-child, #groups li:nth-child(2){
    display: none !important;
    }

    As always, it won't work with most IE browsers.

    ReplyDelete
  21. YoboY Thanks so much for your help with the Css!!

    I have been playing with it a lot and though I had it figured out but I can't seem to change the text size of the labels in flipcard mode. You know when you click "labels" and the posts get arranged next to those labels. The text size of those labels is what I am looking to change.

    I was able to make the text of the labels bold, but it doesn't listen to my font size command.


    I am a teacher and would like to use blogger with dynamic views for 150 student portfolios! I am just hoping we will be able to customize the html more soon!!

    ReplyDelete
  22. @Jon: Me too Jon. Can't wait to play with Dynamic View's template once its HTML becomes fully customizable.

    As for the font-size of your Label tags, add this to your CSS:

    .group-label a{
    font-size: 30px !important;
    }

    Cheers.

    ReplyDelete
  23. Thanks YoboY for your help.
    Perhaps that particular code does not like Google Chrome too...

    ReplyDelete
  24. @TNS: Shouldn't be a problem in Chrome. Hold on, let me check it... .... .... Yeap, it'll work on Chrome. Cheers.

    ReplyDelete
  25. Hey YoboY, thanks so much for the article, it really helps.
    Do you know of a script that will allow me to select a specific view as a default? i.e. Magazine?
    Thanks

    ReplyDelete
  26. @Dan: You don't need a script for that. Just go to your Template Designer, and select Magazine as your default Dynamic View. Then click on Save Template. Cheers.

    ReplyDelete
  27. Your scripts have been so helpful! Thank you!

    My "black bar" keeps hiding itself when my mouse isn't over the header. I would like it to stay visible always. Can you help?

    ReplyDelete
  28. oh thank you for all your tutorials <3
    and blogger should thank you more actually, i was so disappointed with the limited options, i wasn't going to use dynamic views. but now i'm reconsidering... cheers from greece and thanks again

    ReplyDelete
  29. @Katie: I couldn't see an obvious solution at the moment, but I've put your request in my 'play list'. I'll give it a much deeper thought and see if I can come up with a way to remove the black bar's hover effect - and hopefully publish a post about it.

    @diskografies: I'm flattered and glad to be able to help :) More features will be added to Blogger's Dynamic View soon - it won't be long before you completely switch over to DV.

    ReplyDelete
  30. hello,
    I tried this option, then i go to view the blog and all the 'other views' are still showing so i dont what i'm doing wrong. I only want the magazine view, help!!

    ReplyDelete
  31. @SISTA: You should have the following in your Add CSS section. See if what you've pasted is right:

    #Classic.ss, #views ul li:first-child ,
    #Flipcard.ss, #views ul li:nth-child(2),
    #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;
    }

    ReplyDelete
  32. how do I add attribution like copyright?

    ReplyDelete
  33. @TNS I am using the Magazine view and what worded for me, as the pop up window will show the author and date, this code hid those details, and the labels also.

    .publish-info {display:none!important;}

    .labels {display:none!important;}

    ReplyDelete
  34. @Tammy: You can't add attribution in DV, at least not at the moment. If you have further questions that are not related to the tutorial in this post, kindly click here --> Ask A Question

    ReplyDelete
  35. by the way, I wanted to remove the date ribbon and I found the css code to be added ;-)

    Quite proud of myself.

    This is:

    .ribbon {display:none!important;}

    ReplyDelete
  36. How would you change the name displayed for the LABEL title linking to the tags selection ? I've tried to find how to rename a certain nth-child (3 in the #groups section) but I cannot find the solution... Your expertise is welcome ;-)
    Concretely I need the lines that I have to insert in the advanced CSS editor.

    ReplyDelete
  37. @slowbizz: You can't do that with CSS. CSS controls the appearance of a page - the styling. Like the icing on top of a cake. Whereas the actual text/data comes from the template's structure itself - more like the flour of a cake. Therefore, unless Blogger decides to allow users to edit Dynamic View's template code, we're not gonna be able to rename the default texts.

    That being said, if I ever find myself in a situation where renaming the 'LABEL' text is an absolute must for me, I'd use CSS to hide the text, and add a dummy background image to that spot. Of course, the background image is actually an image that has the text that I'd like to display. That's a trick that could work.

    For example, in your blog, say I want to 'rename' the text DATE to.. ermm.. say 'September 2010'.. This is the CSS code that I'd add:

    #main #controls ul li:nth-child(2){
    display: block;
    font-size: 0;
    background: url("http://i.imgur.com/Hy7Hq.png") no-repeat;
    width: 90px;
    position: relative;
    top: 4px;
    }

    Of course, I'm not renaming the text. I just hid the text, and I placed a background that says 'September 2010' at that spot.

    Happy experimenting.

    ReplyDelete
  38. This is great- thanks.
    One problem: I only have one option that I want to show (mainly Flipcard), so all other options are gone, but the arrow is still there. Any way to get rid of it?
    thanks!

    ReplyDelete
  39. I see you gave a code for how to remove the "Author" tag from on the top menu bar.
    Is there a way I can remove the Date one also?
    Thanks!

    ReplyDelete
  40. @Anon: You can get rid of the arrow by adding the following CSS:

    .menu-heading .indicator{
    display: none;
    }


    Cheers.

    ReplyDelete
  41. Hi, is there a way to change the popup box page color? for example when i click on a post in dynamic flipcard view - a popup box opens with the post - and the background is white. I want to change it to black or grey. Also want to change opacity and make it a little transparent. Thanks!

    ReplyDelete
  42. In Dynamic Views - is there a way to hide the "Send Feedback" link in the right hand bottom corner? Or better still, to make it send feedback to the blog owner instead of google? Thanks.

    ReplyDelete
  43. @The Box:

    1) Popup box:
    Add this to your CSS:

    #items li, .overview-inner, #content, .item.hentry.selected, .item.hentry.open, .item.ybyss, #feature, .overview-inner, .column .item, .viewitem-content {
    background: url('http://www.blogblog.com/1kt/transparent/white80.png') fixed !important;
    }

    .items.hfeed{
    background: transparent !important;
    }

    For more background changing options in DV, refer to the link below:
    Change Blogger's Dynamic View Background

    2) Send Feedback button:

    You can't edit it, but you can hide it. Add this to your CSS:

    .feedback{
    display: none;
    }

    Cheers and God bless.

    ReplyDelete
  44. @Anon: You can remove the Date and Author in flipcard view by adding this to your CSS:

    #groups li:last-child, #groups li:nth-child(2), #groups li:last-child, #groups li:nth-child(4){
    display: none !important;
    }

    ReplyDelete
  45. Thank you so much for this very helpful site. With your help I've managed to show only "Magazine" view in the menu bar which is what I have as the default and the only option I want my readers to have, however, is there a way to change the text where it says "Magazine" to something else? For example, now it says "Magazine…page 1…page 2, etc". I'd like it to say "Home…Page 1, page 2, etc.".

    ReplyDelete
  46. JJ iReads: I'm afraid that won't be possible. You can't edit text using CSS. However, you can hide that text, and include a background image file that says home. But I wouldnt go for it.

    My suggestion:
    1) Use the code in Step 1, to hide all your DV options, including magazine.
    2) Using the updated blogger interface, go to Dashboard - Page - New Page - Web Address - Link to your homepage and name it 'Home'.
    3) Arrange it accordingly so that 'Home' will appear before your two static pages.

    ReplyDelete
  47. Thanks to your advice + some A/B trial&error testing + hours of heavy work, this is the project I've just launched based on Dynamic Views: http://www.slowbizz.com. Feel free to register as a host and/or artist ;-) And thanks again for your support.

    ReplyDelete
  48. I'm creating another blog. Just want to thank you for your excellent support here. You are a legend!

    ReplyDelete
  49. Really thank you for these excellent support.

    Just wanted to ask. If possible, how can I hide the "Powered by" link in the DV top right corner?
    Many thanks in advance!

    ReplyDelete
  50. First of all thanks so much, I've been waiting all this time to switch over to dynamic view before moving things along!

    What I can't seem to find is the CSS for removing the date and/or name in the actual post where it says "Posted 26th May by Crystal" For instance: http://www.imagesclipart.com/2011/05/snowflake-12x12-digital-papers.html at the bottom of the post in the middle. (I'd rather just have an about page.) Any help is appreciated, thanks.

    ReplyDelete
  51. @slowbizz: You're welcome. Cheers and God bless.

    ReplyDelete
  52. @slowbizz: You're welcome. Cheers and God bless.

    @Josh: You're welcome :) Use this CSS to hide the link:

    #blogger-branding{
    font-size: 0px !important;
    }

    @Crystal: This should do:

    .publish-info{
    display: none !important;
    }

    Cheers :)

    ReplyDelete
  53. Hi YoboY.Hope your studies are going well. Just a quick question: Is there a way of making the header image(s) in DV into a slideshow? I'm asking this because my header is 65pixel high and was just wondering if it's possible. Many thanks!

    ReplyDelete
  54. @John: Hmm. I can't think of a way to add a slideshow using CSS alone. And that is not a good news, since right now we can only go as far as adding CSS to DV, and nothing else. So, at the moment, nope, we can't add a slideshow to DV.

    ReplyDelete
  55. Is is possible to change the flipcard colour? Thanks!

    ReplyDelete
  56. Nice blog. I would like to know which code I should add to have my pages showing on the header bar. cause since I moved to dynamic views they disappeared.

    Thanks for your time,
    A

    ReplyDelete
  57. Hi - any idea why on my blog (I've added your css code) my Tab pages aren't loading in dynamic view?

    ReplyDelete
  58. Hello, is it possible to take completely this sidebar off from the top, so that viewers don't choose the type of viewing? Thank you!

    ReplyDelete
  59. If I've hidden all the options, can I also somehow hide the now useless link that says "Classic"? I've hidden the arrow and everything just can't get that "Classic" to go away.

    ReplyDelete
  60. @Anon1: You bet! Add this to your CSS:

    .items .item .card .back {
    background: white !important;
    }

    @Anon2: In the New Blogger Interface, go to your Dashboard - Pages - Show pages as - Top Tabs - Save Arrangement.

    @Dan Clay: If you have not got this sorted, go to your Dashboard - Pages - Show pages as - Top Tabs - Save Arrangement.

    @Yo.: This should take the options completely off:

    #views{
    display: none !important;
    }

    @Shepherd: This should do the trick :)

    #views{
    display: none !important;
    }

    Cheers!

    ReplyDelete
  61. Hi YoboY, Just two things: (1)I've hidden all the pages in DV, but I'm stuck with flipcard as the default view. But I want Mosaic as the default view instead.

    (2)Since I'm stuck on Flipcard, is there a way of making the thumbnails slightly larger?

    Thanks for your support!

    ReplyDelete
  62. @John B: Why don't you go to your Template designer and choose Mosaic as your default view? Also, you can always use the url trick. Just add /view/Mosaic to that back of your URL.

    2) The thumbnails in Mosaic are dynamic. The size for an element will always change when you publish a new post. We can't easily alter its size without pixelating the thumbnails, if you get what I mean.

    ReplyDelete
  63. hahaha... but of cause. missed that one... Cheers!

    ReplyDelete
  64. @John B: You should get a cup of coffee :) Have a nice weekend.

    ReplyDelete
  65. Hi I have a question: I did everything as you said, only my menu is a pull down (not a one line like in your example)... so it did not change anything. Help please! Thank you :)

    ReplyDelete
  66. @EM: It doesnt matter if you a drop-down menu or a horizontal link. Just add the following code to your CSS, and that you should get rid of your menu:

    #views{
    display: none !important;
    }

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

    Cheers.

    ReplyDelete
  67. Say YoboY, I'm getting really close to completing my new DV blog and couldn't have done it without your super help and generosity. Just wanted to ask: is it possible to hide that annoying loading blogger icon(grinding gears)?

    ReplyDelete
  68. @John B: Someone asked me the same question, and I've tried to capture it before, but the gears are too fast for my eyes and tools. I couldn't analyse, thus I couldn't do anything about it. Sorry mate.

    ReplyDelete
  69. Hi! I have try your way to change the view.I had changed it into Magazine view only.But when I open the blog,it still shows Classic view instead of Magazine.The Magazine button is there,so I have to click it first,then the blog will change into Magazine view.What I'm gonna do if I want to straightaway view the Magazine view WITHOUT need to click that Magazine button? Thanks.

    ReplyDelete
  70. Is there any way of using my own links? (for eg: using a 'facebook'link)

    ReplyDelete
  71. @kapkek: I got what you mean. This tutorial is meant for you to hide the other links that you don't want to be seen there. To set a view as a default view, you need to use the template's designer. Go to your Template Designer - Templates - Dynamic View - Choose the 3rd option for Magazine view. Good luck :)

    @Karthikeyan KC: Nope, you can't add custom links in there, but you can use the Pages gadget to add custom links. From your Dashboard - Pages - New Page - Web Address, and the rest is self explanatory. If you want to have your pages gadget as a dropdown menu, see the link below:

    Drop-Down Pages Gadget Menu in Blogger Dynamic View

    ReplyDelete
  72. Hi! I was wondering if you had any tutorial or any way to add pages to the dynamic view template? Like shown in this website...
    http://www.slowbizz.com/p/host.html

    ReplyDelete
  73. @Pain & Nanto: Adding a pages gadget is fairly straight-forward. Go to Dashboard - Pages - Show Pages as - Top Tabs - Save arrangement.

    It goes without saying that you need to have some static pages created before adding links to them. Cheers :)

    ReplyDelete
  74. Hi YoboY,

    Please help. I have the classic, flipcard and sidebar views enabled in DV, but I still can not hide the 'author' option in the flipcard menu with your given css code. I would really appreciate your help. Thank you.

    ReplyDelete
  75. Is there any way to put an external link (to my other site) within that view bar? It's just hard to know which containers I'm supposed to add a css exception to...

    Thanks for your tutorials, they're helping me out a lot!

    ReplyDelete
  76. Admin: Add the followinf to your css, don't forget to press enter after the last character of the last line }

    #groups li:last-child{
    display: none !important;
    }

    @MossP: Have you tried adding your external links to your pages gadget? Go to Dashboard - Pages - New Page - Web Address. That's the easiest, and probably the only way, to add external links to your header bar in Dynamic View.

    ReplyDelete
  77. Hi YoboY,

    Help again pls, it's admin: dec 12, 2011 3:54 AM. The code still doesn't work for me, unfortunately. Is there something else I'm missing?

    ReplyDelete
  78. @admin: Just checked, and still works. Here's my test page. You should not see the 'arthur' option.

    http://yoboy-testblog7.blogspot.com/view/flipcard

    Were you using Internet Explorer? It won't work in IE.

    ReplyDelete
  79. Works now. Thank you so much. I kept staring at my code and found that the previous bit of code just before that one wasn't enclosed with the closing "}".

    ReplyDelete
  80. could i ask a huge favor pretty please: i've got to show you my page in order to explain my problem, but can i ask that you don't share it. the project is not yet launched and so is confidential.

    my problem is that there is some amount of space between a static (about) page when the (about) page is clicked and the menu bar. how can i remove this space please? this space is present in every view i have enabled in the dynamic blogger view. please help me if you can.

    thank you very much.

    ReplyDelete
  81. @admin: Glad you finally managed to make it work. As for the gap in your static page, well, just get in touch with me privately using email. You could share your blog's address then, and I'll have a look. To send me an email, just use the contact form, and send a dummy contact request to me. That should reveal your email address to me, and I'll reply back to you in private.

    Cheers.

    ReplyDelete
  82. @Ammar: Happy to help, as always :)

    ReplyDelete
  83. Hi, I have a small problem with my blog (http://blog.ju29ro.com/).
    I applied many of your suggestions, and indeed I was able to customize the Dynamic View layout. Nevertheless, if you click on the menu, the whole post page moves down and leaves an awful empty space.
    I tried to touch some parameters, but nothing changes.
    Any suggestions?

    Thanks!

    ReplyDelete
  84. @andrealoca: Im terribly sorry about that bug. I've tried removing it, but unfortunately removing the bug meant removing the key feature that made the other tweaks work. I'll try to find other ways to address this bug. Sorry again.. Happy 2012..

    ReplyDelete
  85. Hello, thank you for the very useful info. I posted the code and it left the flipcard, which is what I wanted. But when I go to my blog, it displays the photos in the Classic mode. I want the blog to display in the flipcard mode only. Am I doing something wrong? Thank you.

    ReplyDelete
  86. @Rick Waldroup: This tutorial is meant for you to hide the other links that you don't want to be seen there. To set a view as a default view, you need to use the template's designer. Go to your Template Designer - Templates - Dynamic View - Choose the 3rd option for Magazine view. Good luck :)

    ReplyDelete
  87. Hey there ! your tutorial works charm, thanks a lot.

    I have a question, I wanted to add a page that have external links of other sites. I created a page and accidently chose to put it at side bar instead of the header. seems like it doesn't appear anywhere in my blog.

    When I deleted in and create a new one, it's like putting at the side bar has become a default setting as blogger is no longer prompting me options on where to put upon publishing the page. Is there any ways that I can overcome this issue?

    Thanks in advance !

    ReplyDelete
    Replies
    1. Worry no more. I happen to know a way to manually set the position of your pages links in Dynamic Views. Go to Dashboard - Pages - Show pages as - Top tabs - Save arrangements.

      All the best!

      Delete
  88. hi..thx for the great tutorials..
    I don't make my blog in dynamic views as default.
    But I got an idea to use it as my archive page. what I mean is I put a hyperlink on my blog that links to it, ex: "southernspeakers.net/view/flipcard/" in that view my readers can see all my posts in one page (so it's like how the Tumblr does ;P ).

    But by default the view was grouped by 'recent'. So is there a way to make that flipcard page grouped by date as default. Or how to make a link that refers to flipcard page grouped by date?

    Thx...

    ReplyDelete
    Replies
    1. Lots of people have asked this before. Unfortunately, there doesnt seem to be a way to get a direct link to flipcard view sorted by date. It's a shame, I know. I'll keep you posted here if I ever come across one.

      Delete
  89. Hi Yaboy,

    How to change Recent and Label in flipcard view into icon image?

    ReplyDelete
    Replies
    1. Add this to your CSS. Change the addresses to match the addresses of your icon image. Also, change the width attribute accordingly.

      #main #controls ul li:nth-child(1){
      display: block;
      font-size: 0;
      background: url("http://lh4.googleusercontent.com/--cem13oEXhA/AAAAAAAAAAI/AAAAAAAADCk/f78l1RyUdNI/s26-c/photo.jpg") no-repeat;
      width: 5px;
      position: relative;
      }

      #main #controls ul li:nth-child(2){
      display: block;
      font-size: 0;
      background: url("http://lh4.googleusercontent.com/--cem13oEXhA/AAAAAAAAAAI/AAAAAAAADCk/f78l1RyUdNI/s26-c/photo.jpg") no-repeat;
      width: 5px;
      position: relative;
      }

      BTW, it won't work in Internet Explorer.

      Delete
  90. Yoboy, u are the most powerful man on earth dude, i don't know how do u know all of this hidden thing... i hope we can cofee out some time......

    i just want ask u, are possible to add just 'label' & remove author, recent and date on landing page in flipcard view

    and are possible if i want resize tumbnail on 'label' at flipcard view?

    Thanks dude.

    ReplyDelete
    Replies
    1. No problem bro. You can remove author, recent and date by adding the following to your CSS (wont work in IE), but it will still land on Recent page first. There isn't a way to change this at the moment.

      #groups li:first-child, #groups li:nth-child(2), #groups li:last-child{
      display: none !important;
      }

      As for the thumbnail size, you can make it bigger, but due to the dynamic nature of the thumbnails, you can't adjust the padding between your thumbnails. You'll end up having thumbnails that overlap on top of each other. See what I mean:

      .flipcard .grouped #content.items .item .card .front, .flipcard .grouped #content.items .item .card .back, .flipcard .grouped #content.items .item .card {
      width: 130px !important;
      height: 130px !important;
      }

      Cheers.

      Delete
  91. hello, can i remove 'page title' on pages?

    ReplyDelete
  92. Hi Yoga, can i remove Date from my post?

    ReplyDelete
    Replies
    1. Sure thing. Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      .flipcard .overlay .date{
      display: none !important;
      }

      Cheers :)

      Delete
  93. Hey Yoga Thanks for the info here its priceless...hey is there a way to hide certain pages in the navigation bar in dynamics view..I dont mean the static pages with the different views i mean as i add pages they appear there and i want to hide certain ones...thanks

    ReplyDelete
    Replies
    1. Hi THR,

      I do know a way:
      1) Go to Dashboard - Template - Customize - Advanced - Add CSS - Copy these codes and save them somewhere safe in your computer, coz you're about to lose them. Don't bother this step if you don't have any custom CSS code in here.
      2) On the same page, switch to a non-dynamic view template, say Simple Template. Click Save when you're done.
      3) Go to Layout tab, and edit your Pages gadget. Uncheck any one of those boxes. Yes, one will do for now. Save when you're done.
      4) Go back to Template tab - switch to your preferred Dynamic View template.
      5) Go to Customize - Advanced - Add CSS - Paste back the code that you've saved from Step 1.
      6) Now, go to Dashboard - Pages, and you should see a new category called 'Hidden'. Simply drag and drop your pages to the hidden category to hide them.

      Screenshot

      Delete
  94. Hi, I've been using a lot of your CSS tricks recently and I now switched again to Dynamic Views and, as the picture you posted, I'm using the sidebar style. So, here I come with a few questions:

    How do I completely remove the black bar?
    I want to change the text color for the sidebar post list, but I can't find a way, could you teach me this and how to make the sidebar background transparent (like having the selected post and the body opaque, but the whole sidebar transparent)?

    ReplyDelete
  95. Hi Kleverson,

    1) To remove the black bar, add this to your css:

    .header div.header-drawer{
    display: none;
    }
    #sidebar, #content{
    margin-top: -34px !important;
    }

    2) To change text color:

    h3 a{
    color: blue !important;
    }

    3) To make unselected tabs transparent, add the following. But you need to keep in mind that the base color here is light grey. Thus, changing the tabs to transparent will still look light grey unless you change the base color:

    .comments{
    margin-top: 0px !important;
    }
    .sidebar .item{
    background: transparent;
    }

    All the best!

    ReplyDelete
  96. Okay, so Blogger's changed something (added gadgets along the side) and now I can't get the fabulous css code above to work anymore (the one to do with blocking other template designs and removing the date ribbon.) Any ideas anyone please!?

    ReplyDelete
    Replies
    1. Hi Dan,

      This is what I'm seeing
      http://i.imgur.com/T49wx.png

      Are you seeing something else?

      Delete
    2. Clear your browser cache :)

      I wound up having to reset my default view, and then my css wasn't working. Finally I cleared my cache and all was well.

      Delete
  97. trying to remove "Recent,label" Etc... as you told here in comments, but it doesn't work totally ... Remains 2 :

    Recent
    Label

    and I don't want them..

    I've used this


    #groups li:first-child{
    display: none !important;
    }

    #groups li:nth-child(2){
    display: none !important;
    }

    #groups li:nth-child(3){
    display: none !important;
    }

    #groups li:last-child{
    display: none !important;
    }

    ReplyDelete
    Replies
    1. Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      .flipcard #controls{
      display: none !important;
      }

      Cheers.

      Delete
  98. Hi - I want to remove the "by [author]" at the bottom of each post, but want to keep the date part of it... I found a way that removes it all, but not sure if this can be manipulated to just one part of it. (Works in IE as well, which is nice)

    .publish-info {
    display: none;
    }

    That is what I'm using... Any ideas for just removing author?

    ReplyDelete
    Replies
    1. Do know a way. Use this CSS instead :)

      .publish-info{
      font-size: 0px;
      }

      abbr.time{
      font-size: 14px !important;
      }

      abbr.time:before{
      content: "Posted ";
      font-size: 14px !important;
      }

      Delete
  99. I've managed to hide everything except 'Label'. How can I hide it + hide the view of labels in posts?

    ReplyDelete
  100. Okay, I've figured out how to hide Label from the main page, WOOHOO! BUT, how do I hide the label words from being viewed at the bottom of each post? I would be so grateful if someone could help answer that for me.

    ReplyDelete
    Replies
    1. Hi George,

      To hide the labels from your post, add this to your css:

      .labels{
      display: none !important;
      }

      Cheers :)

      Delete
    2. THANKS! That worked perfectly.

      now....anyone know how I could remove the title header and have an image in its place?
      I have an image set as a default from my previous layout but it's just not overriding this stylesheet, I guess.

      Delete
  101. First I'd like to echo all of the thanks for your help here. Google should really be providing this, but I'm so glad you are.

    Secondly I would really appreciate some help please with a few related things:

    1) Is it possible to change the word "Label" to be something else, e.g. for my blog I want this to say "Group by DJ" (or similar)

    2) The dates that show on the back of the flipcards only show day and month, is it possible for them to show year as well?

    3) The tips above for hiding certain views (e.g. Mosaic don't seem to quite work for me - they hide views, but not the ones I choose (e.g. I delete Mosaic from the CSS but flipcard gets hidden instead)

    Finally, any thoughts on how to handle multiple labels - I used to typically have two or three labels (DJ, style) but to get things to work with dynamic view I've had to go back to just using one.

    thanks again, my blog is here in case it helps... http://collectivedischarge.blogspot.com/

    Mark.

    ReplyDelete
    Replies
    1. Hi Mark,

      1) I've answered this question before. It isn't possible, but there's a work around. Click here to see my previous response.

      2) I'm afraid this isn't possible. I can think of many ways but all of them involve javascripts. At the moment, it isn't possible to insert javascript in Dynamic Views.

      3) I think you've misread the instructions in Step 2. You need to remove the lines for views that you wanna keep. In other words, your code should consists of the views that you wanna remove. I know it isn't intuitive, but there isn't an easier way to do this. Here's an example. If you want to remove Mosaic view alone and keep all other views, your code will look like this:

      #Mosaic.ss, #views ul li:nth-child(4),
      {
      display: none !important;
      }

      4) I'm not quite sure what you meant by handle, but you can add labels gadget to Dynamic Views now. Go to Dashboard - Layout - Add a Gadget - Labels. This should appear on the right of your blog.

      Cheers!
      Yoga

      Delete
  102. Cheers Yoga, that should be Yoda, btw :-)

    1) Thanks, I'll live with it for now

    2) Shame, but thanks anyway

    3) Yup, sorry had misread instructions - oops.

    4) If you put multiple labels on a post (e.g. "Radio Show", "Funk") then in the Flipchart view when you choose "Label" the post will only appear once on the page against either "Radio Show" or "Funk" and it seems arbitrary which one it gets mapped to.

    Consequently I've had to re-label all my posts just using one 'category' of label so that the "Label" view works correctly, but this means I can no longer fully exploit a label cloud as I could before.

    Thanks again.
    Mark.

    ReplyDelete
    Replies
    1. How about that.. I've never noticed this bug before. Can you do me a favor? I'm gonna report this bug to Google, and I need you to set up a discussion thread in Blogger Help Forum to support my complaint. Just copy and paste whatever you've written in the comment above in the following link, I'll take care of the rest:

      Blogger Help Forum

      Do let me know the address of your discussion thread.

      Delete
    2. Thanks Yoga, would be ace if google can do something about this as it is a huge constraint on how I'd like people to interact with my blog, although I can also see that having posts appearing multiple times in the flipchart/label view could be confusing.

      I've started a thread as you suggested, the link is
      http://www.google.com/support/forum/p/blogger/thread?tid=14dee842ff3f1c50&hl=en

      Delete
  103. Adding the code seems to change my default view from Mosaic to Flipcard. When I change it back using the template designer I lose all of my font and color tweaks. Anyway to designate the default view without losing all of the design tweaks? Thanks!

    ReplyDelete
    Replies
    1. Hi Bob,

      It is technically impossible for CSS code (be it this one, or any other) to change your default Dynamic Views. The only way your dynamic views can be changed is via Template Designer - Templates. The code in this post merely hide the options for users to click on other non-default view, that you don't wish to show.

      That being said, changing from one default view to another (via Template Designer - Templates, that is) will make you lose all your changes. You could, however, save your custom CSS code that you've added to the 'Add CSS' box, and make a backup of it. After changing to a new view, you could re-insert this code back to the 'Add CSS' box.

      Delete
  104. Thanks for the quick response Yoboy!

    I guess I was surprised that the CSS code I added changed the default view that I had already selected using the Template Designer. So, if I am hearing you right, the CSS code you specify changes the default view so that I have to redo the default view and then redo the CSS changes. Right?

    ReplyDelete
    Replies
    1. No Bob, that was not what I meant. What I meant is, there is absolutely no way to change your default view by adding any CSS. That means, the CSS that you added could not be responsible for the change in the default way - it is just technically impossible. CSS is a styling code, it just changes your appearance. It cant do anything more than that. Whereas, changing your default view is equivalent to changing your template. Changing the default view, like what happened in your case, requires settings change. CSS simply can't do that. The only possible way for that to happen is by going to Template Designer - Templates. In other words, someone might have tempered with your settings, if you're absolutely sure you did not change the default view by yourself. Again, adding a CSS can never change your default view.

      Delete
  105. I know that you are all pro's.
    All modifications are still working.
    Thank you for all your tips!!!!

    Here is my version of the dynamic views
    "http://roadtoeverest202x.blogspot.com/"

    Here are my 3 questions

    How can I show an event calender, where my followers can see my appointments? Is there a solution?

    I want to use the translate option of google. How can I solve the gadget problem? May I use the link function at the pages on top? That my followers gonna be linked to the Google translate page?

    How can I adjust the bar above the pages on top. I think the line for my header "road to everest 202x" is to thin. I cannot use a larger font!


    Thank you!!!

    ReplyDelete
    Replies
    1. Hi Matthias,

      1) Usually, I don't recommend a third-party product's code as there are hundreds of them. But I just happen to saw a website called eventbrite.com that let's you create an online calendar with marked appointment date. You can sign up for it, customize your calendar, and get its code. Once you have code, go to Dashboard - Pages - New Page - Blank Page - HTML - And paste your code there.

      2) Unfortunately, it isn't possible to introduce the translation gadget at the moment.

      3) See this link:
      Add Header in Blogger Dynamic View

      Delete
  106. Thanks for the feedback Yoboy! I was surprised that the default view changed when I added the code to the CSS. I accept your idea that it is impossible to happen. Yet I cannot comprehend how it happened as the default view was set to Mosaic and after the CSS was updated the default view was Flipcard. Happily, after resetting the default view and changing all the fonts and colors back, things seem to be working fine.

    ReplyDelete
  107. Very helpful, thank you! Unfortunately I use IE so I can't get rid of the other options. You wouldn't happen to know hwy when i use the flipcard option only the first 25 posts show, and then sometimes if you refresh it they all show would you?! it's driving me insane!

    www.myfavouritetreasures.com

    ReplyDelete
    Replies
    1. Hi CW,

      I'm seeing a pgefull of flipcards. Nothing seems wrong with your blog. Have you tried with a different computer or browser, you know, just to see if what is actually wrong with what you're seeing? See the screenshot below:
      http://i.imgur.com/Jw4sK.jpg

      Delete
  108. excellent. thank you. even i could do it and i'm a real numbnut when it comes to css.

    ReplyDelete
  109. Hello,

    I have tried all of the options, but none of them seem to work. One that was closest was this:
    #Classic.ss, #views ul li:first-child ,
    #Flipcard.ss, #views ul li:nth-child(2),
    #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;
    }

    but it was missing Magazine. I added it myself, but it didn't want to work. How do I fully get rid of Classic Sidebar?

    ReplyDelete
    Replies
    1. Hi KAT,

      To get rid of Classic and Sidebar views, use the following:

      #Classic.ss, #views ul li:first-child ,
      #Sidebar.ss, #views ul li:nth-child(5)
      {
      display: none !important;
      }

      The tweaking is kinda non-intuitive. Sorry 'bout that.

      Delete
  110. Hi Yoboy.
    I must say thank you very much for posting all these marvellous tricks about customizing the dynamic view, it's been helping me a lot. * four thumbs up *

    just a bit of a problem. I'm using the flipcard view. and i'd be happy if i could turn off the 'open new tab' feature for the home button and each links under the label... and i've been wondering why is it set to act that way by default?

    thanks a lot brother
    you're the Mannn!!

    ReplyDelete
    Replies
    1. It has been a nuisance for many, myself included. Unfortunately, to make the links load on the same tab, we'd need to modify the template's HTML. And at the moment, we don't have access to dynamic view's HTML. Looks like we're stuck with it for now.

      Delete
  111. Hi Yoboy,

    The Classic button is still there, but the sidebar is not working anymore.

    Thank you! :)

    ReplyDelete
    Replies
    1. Hi KAT,

      You're still seeing 'Classic' coz it is your default view. You need to change your default view from Classic to something else. To do this, go to Dashboard - Template - Choose some other view.

      Once you've chosen a different view, add this to your CSS, and the classic and sidebar options should not be visible anymore.

      #Classic.ss, #views ul li:first-child ,
      #Sidebar.ss, #views ul li:nth-child(5)
      {
      display: none !important;
      }

      Delete
    2. Oh nevermind, I got rid of it. Thank you very much for your help! :)

      Delete
  112. What's up? and thanks for all the good work!

    Once the date ribbon is removed, that space there, is there any way to move text so as to let it begin from THAT space?

    In other words, make it so that anything you type, can begin as close to that left boundary as possible, you know, like how it is in this very comment box?

    Also I found someone who found out an easier way to access html in dynamic views. (So you don't have to do that "> > > >" thing.

    http://www.mybloggertips.com/2012/01/how-to-edit-blogger-dynamic-view.html

    props^.

    And finally, I've been having trouble with my css customizations not showing up on its mobile iteration.
    You know, like, Mobile template > Yes > custom.

    On my phone, it only works from time to time. All the share buttons, and search bar removal, and other customizations, show up after like I refresh the page on my phone a couple times, and then when it does, if I refresh it again, it goes back to plain dynamic views, pre-css fun.

    As much as I without a doubt prefer blogger over say, tumblr,
    blogger is wack when it comes to mobile customization.

    I mean even in default template, it has like some ugly stuff like the arrow, and bad allocation of space per post, and stuff at the bottom you can't fix or take out; :(.

    Sorry for such a long post/slight diatribe at the mobile stuff,
    but can you help me with the first part? That would be great!

    ReplyDelete
    Replies
    1. Hi Anon,

      1) I'm kinda lost for the first question. Which date ribbon are we talking about again? Do you think I can have a look at your blog by any chance?

      2) Brilliant! A way to edit HTML! Yea~.. But, if you're just gonna add CSS to your template, by all means do it via the Template Designer.

      3) Mobile template is probably the least worked on area in Blogger. It's hard to tell why your blog isn't loading your custom CSS. But if it is any consolation, sometimes browsers don't load custom CSS as well! This has been notified to the Blogger team and hopefully they're working on it.

      Delete
  113. http://min.us/mmDYys4mZ

    Whatcha' think?

    ReplyDelete
    Replies
    1. Hmm, yeah possible. But with the limited info I've got, this is as much as I could suggest:

      .item{
      padding: 2px !important;
      }

      Tested on Classic view. Is this about right? You can still keep your date ribbon as they're totally independent of each other.

      Delete
  114. Hi, as soon as I enable some static pages the dynamic views become a drop down menu. Is there a way please to stop that so that the dynamic view choices are centred? I can only achieve this by turning static pages off, which I'm happy to do with the dynamic view template as I use a links gadget for my menu. However, if I turn pages off they then don't appear in the mobile template. Any ideas please? Worst case scenario I'll have to go back to having the dynamic views menu displayed as the drop down in the left default position :-(

    ReplyDelete
    Replies
    1. Hi Anon,

      I'm afraid I'm not aware of any methods to do so. If I ever come across a way, I'll write a post on it - not anytime soon though, as it looks like this behaviour is being controlled by external script hosted at Blogger (something we don't have control on).

      A workaround would be to add your dynamic view links as pages links manually. We can then remove the dynamic views drop-down completely. Does this make sense?

      Delete
    2. Hi Yoboy, Thanks for your reply. I've used your CSS code from your OP above to remove the dynamic views menu all together. I realised later that more than one Links gadgets could be added, so created one of those with just the dynamic views in which is now part of the docked gadgets menu on the right which I think looks neater for now. I think the problem of adding them as page links would have been them also showing up under the mobile template page menu? Unless you meant the page links could be added to the menu bar directly in the CSS code?

      Delete
    3. Hi Anon,

      I'm quite confused. Do you or don't you want your Dynamic Views options to show? If you want the options to show, and centered, you could

      1) Disable the default left drop-down position.
      2) Add the options as links to your pages gadget (all 7 of them)
      3) Hide other pages link from showing up in your menu bar (optional)
      4) Center the pages link in your header bar.

      If you follow the steps above, only the 7 Dynamic Views option links that you add to your pages gadget will be shown in your mobile view.

      Btw, what's your blog address?

      Delete
  115. Hi,

    Firstly thanks for the advice. In the absence of being unable to put my own links at the top where the 'pages' are, is it possible to only show certain pages? Ie I'd like to hide the ones I have previously created and replace them with new ones that work as links.

    ReplyDelete
    Replies
    1. Hi Anon,

      Actually, you can put your own links in your Pages menu. Go to Dashboard - Pages - New Page - Blank Address.

      And if you want to hide some of them, switch to the old interface temporarily (Dashboard - Gear icon - Old Blogger Interface), then go to Design - Page Elements - Pages - Edit - Uncheck some of the boxes. Once you've done this, save the gadget and your changes, and go back to the new interface. Now when you go to Dashboard - Pages, you'd see a new area for hidden links. Simply click and drag your pages to that area and the links won't show in your blog anymore.

      Delete
  116. Hey, how can i remove the subscribe popout link?
    Thank you!

    ReplyDelete
    Replies
    1. Hi Anon,

      Are you referring to you sidebar gadgets? May I have a look at your blog?

      Delete
    2. Hey! I think that's it... Here's the link http://onegoldenelephant.blogspot.pt/

      Thank you!

      Delete
    3. Right. Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      #gadget-dock{
      display: none !important;
      }

      Delete
    4. Thank you so much! What about the "send feedback" link, what's the code for that?

      Thanks again.

      Delete
  117. Hi, I've pasted the code and the views disappeared, but now one is reappeared again, whit also the "Home Page" label. I think it reappeared after I just checked the "Home Page" setting under "My Blogs"->"Pages" but I can't image why. What can I do to remove then now?

    And another thing: how can I set an image instead of the name of the blog in the upper-left corner? It should be easy whit the Blogger editor but it simply doesn't work to me.

    That's my blog anyway if you want to check
    http://idobloni.blogspot.it/

    Please help
    Thaks

    ReplyDelete
    Replies
    1. Hi Angel,

      I don't see any custom code in your blog. Can you recheck it to see if it is there? If you're having trouble making the code stay in your blog, try using a different browser.

      To have an image as your header, see this link down here:
      http://www.southernspeakers.net/2011/10/add-header-in-blogger-dynamic-view.html

      Delete
    2. Ok, I've replaced the code and now I'm practising whit to fit the header logo.
      Now only remain the "Home page" in the bar that I can't remove.


      Thanks a very lot!

      Delete
    3. Hi Angel,

      Use this. Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      #pages ul li:first-child{
      display: none !important;
      }

      Cheers.

      Delete
  118. Hey first of all thanks for all the great help. My question is in the Flipcard Dynamic view is it possible to completely remove the options below the siderbar "Recent, Date, Label, Author" or better yet just delete the ones I do not want? Thanks for the help!

    ReplyDelete
    Replies
    1. Oh yes..

      To completely remove them, use the following CSS. Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      .flipcard #groups{
      display: none !important;
      }

      To selectively remove them, use the following. This example will remove the second option (date). Repeat the code accordingly and change '2' to either 1, 3 or 4 if you want to hide the others. BTW, it won't work with IE8 or older.

      .flipcard #groups li:nth-child(2){
      display: none !important;
      }

      Delete
  119. Thats awesome thank you... one more quick question. Is there anyway to change it from saying "Date" to something else like "Archive" maybe?

    ReplyDelete
    Replies
    1. I happen to know a way. Add this to your CSS:

      .flipcard #groups li{
      font-size: 0px;
      }
      .flipcard #groups li:before{
      content:"Archive";
      font-size: 15px;
      }

      Cheers!

      Delete
    2. Thank you Yoga for the many hints. About this above topic, if I copy paste this code I see all the 4 groups (Recent Date Lebel Author) of Flipcard change in Archive (Archive Archive Archive Archive) probably because ina previous post you suggested how to delete 3 out of 4 groups.
      Ho can I manage to ahve still the 4 groups named All Date Category Name?

      Another two suggestion I need:

      1) the thubnails in the Recent group are big enough to diplay text on the back but not all the title of the post, even now that I managed to remove the date from there (thanks to a previous post) so how can I change the font size of the back of the card, and how can I show as much as possible text making it occupy all the back of the card?

      2) How can I manage to show text also on the back of the small card in the groups Date Lebel and Authors?

      Thank in advance

      Delete
    3. This took me awhile to figure out.

      0) Use this:

      #groups li{
      font-size: 0px;
      }

      #groups>li:nth-of-type(1):after{
      content: "All";
      font-size: 14px;
      }

      #groups>li:nth-of-type(2):after{
      content: "Date";
      font-size: 14px;
      }

      #groups>li:nth-of-type(3):after{
      content: "Category";
      font-size: 14px;
      }

      #groups>li:nth-of-type(4):after{
      content: "Name";
      font-size: 14px;
      }

      1) Use this:

      .overlay .title{
      height: 110px !important;
      max-height: 110px !important;
      font-size: 14px;
      }

      2) Not fundamentally possible.

      Cheers!

      Delete
    4. wow great work man!! It works fine.

      To fine tune my page would be nice:
      1) when visualizing the Date group that posts are grouped per year, like all those of 2012, all those of 2011 and so on, and not like now they are grouped per month like January 2011. Is this possible?

      2) In a previous post you showed us how to resize the small thumbnails of the groups Date Lebel Author (now 2 out of these 3 renamed in my page) but they were overlapping, but mainly on the horizontal axis not on the vertical where there is a bit more space in between. Any way to put more space between thumbnails of these groups' thumbnails? above all for the horizontal spacing of the thumbnails, but would be good also between the lines in the vertical axis.

      Thanks in advance again!!

      Delete
    5. Hi FDLA,

      1) Nope. There isn't a way to change that. These things run off scripts hosted at Google, and we need to have the scripts altered if we want a structurally tweaked template. Right now we can only make cosmetic changes, and that isn't easy either.

      2) I'm afraid I'm not following. Can you take an annotated screenshot of what you're seeing?

      Delete
    6. Hello Yoga, thank you:
      1) ok I understand
      2)in point two I was asking if when I use the code you showed us in a previous post, this:

      .flipcard .grouped #content.items .item .card .front, .flipcard .grouped #content.items .item .card .back, .flipcard .grouped #content.items .item .card {
      width: 130px !important;
      height: 130px !important;
      }

      then the thumbnails ovelap, so I was asking if there is a way to make more room between the thimbnails horizontally and vertically.

      then I have few more questions for a fine tune:
      1)is it possible to change the color of the texts list on the left when I visualize the groups Date Lebel Author? It is black (or similar) so I cannot use a dark background for the main area of the blog.
      2) Now that I have changed the names of the groups with your code, it happens that when I hover the mouse on the names I see still the previous names.It says: recent, Group by Date, Group by Lebel and Group by Author.There is way to eliminate this?
      3)Is it possible to resize (make smaller) the vertical size of the header?
      You can check my site http://fdlarchitecture.blogspot.com/

      thank you!!

      Delete
    7. 0) Right. I don't see a way to avoid the overlapping. It has been dynamically structured to appear that way.

      1) Yeah, use this:

      #labels span{
      color: white !important;
      }

      2) There aren't any CSS attribute to define alt text. Besides, Blogger is using a new field altogether. Needs to be structurally changed.

      3) The size of the header isn't fixed. You might see the width of your header to be say, 1000px. But in my computer, it's 800px. It'll be dynamically set when your blog page is loaded. Trying to set a static value to the width of your header is just gonna cripple your blog, especially when viewed by readers that aren't using the same resolution as your display.

      Delete
    8. Thank you Yoga, now I also managed to make that text smaller (putting together the info I see in the code you send me. So I did:

      #labels span{
      font-size: 12px !important;
      }

      :)
      the point is that I should write some title of works so in that text fit just a couple of words. There is a way to make that text multiline?

      thanks in advance

      Delete
    9. There is a way to make that text multiline?

      Hi FDLA,

      Which text are we talking about?

      Delete
    10. Hello Yoga, I mean the left side coloumn of texts inside the groups Name Date Category in my page now.

      Thanks

      Delete
    11. Hi FDLA,

      I'm seeing multiline by default in your cards. Or I'm looking at the wrong place. Could you provide screenshots please? That will be much easier for me.

      Delete
    12. Hello Yoga, of cource! But how can I upload images here? I don't see the way...

      Delete
    13. HI FDLA,

      It's easy, save the screenshot in your computer, then upload it to an image-hosting site, like imageshack or something. You can even host it at your own blog:
      http://www.southernspeakers.net/2011/09/obtaining-direct-links-from-blogger.html

      Delete
    14. Hello Yoga, I just made a post with the screenshots
      Thank you

      Delete
    15. sorry.... this is the link http://fdlarchitecture.blogspot.com/2012/05/service-questions-post.html

      Delete
    16. Hello Yoga have you seen my post? The link was correct?

      Thanks

      Delete
    17. hello again Yoga I changed the post with the screenshots (to ask your advice) with a page so is less visible on the website.
      http://fdlarchitecture.blogspot.com/p/service.html
      Thank you

      Delete
    18. Hi FDLA,

      Sorry for my late reply. I was kinda tied up with my dissertation. So, here's what you need:

      1 n 2)

      .group-label span{
      display: block !important;
      width: 180px !important;
      white-space: normal !important;
      }

      3 n 4) I think I've mentioned this before. We can't make any structural change, so nope, it is not possible to change the year or change the order of the labels.

      Cheers!

      Delete
    19. Hello Yoga, I will work this out. You'r always very helpful. Thank you.
      Francesco

      Delete
  120. Dude you rock. check out my site if you have a chance... www.purintonsnotes.com. could not of done any of it without you.

    ReplyDelete
  121. I set my Blog in dynamic View http://www.myclicksense.blogspot.co.uk but unbale to open it in IE instead there is total blank page. If some could assist here please ... Total Lost

    ReplyDelete
    Replies
    1. You arent using Dynamic Views, and I can view your blog fine in all browsers. Try clearing your cache and cookies in IE, and force a hard refresh by pressing Ctrl+F5 on your keyboard. Cheers :)

      Delete
  122. Can we completely disable this dynamic view, I do not want any user visit me with dynamic views from search engine. Please ...

    ReplyDelete
    Replies
    1. Hi Sumcara,

      Users won't be able to access the Dynamic Views side of your blog via search engines, but they can do so (optionally) by altering your URL. There was a time when you could disable Dynamic Views by disabling your feed, but it doesn't seem to work anymore. So nope, can't think a way to prevent users from accessing the DV side of your blog.

      Delete
  123. Earlier you wrote me some code for my Flipcard dynamic template that replaced the options Date, Author etc and replaced it with just archive. My question is, is it possible to add different links there like a link to my twitter and facebook page? Thanks for the help!

    ReplyDelete
    Replies
    1. Nope, it isn't possible. Right now we can only go so far as to make CSS changes, and CSS only allows cosmetic tweaks. Link-alteration would require script changing, which we don't have access to.

      Delete

Please use the 'Ask a Question' page to shoot questions that are not related to the tutorial in the post above.