Southern Listeners

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

Sunday, November 6, 2011

Drop-Down Pages Gadget Menu in Blogger Dynamic View


Here's a quickie. By default, when you add pages to your Pages gadget in Blogger's Dynamic View, you'd end up with stretching horizontal links. With this simple tweak, you can transform it to a drop-down styled menu instead! This is a response to blog reader OnlyUs.

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.
#header.header .header-drawer #pages.tabs ul li{
margin: 100000px;
}
Also, I've been busy with my school works lately. My apologies if I reply to you guys late. Cheers.

118 comments:

  1. Thank you again! Works like a charm. - OnlyUs

    ReplyDelete
  2. @Metch: No problem. Glad you like the tweak.

    ReplyDelete
  3. hi u got much more potential to make a blog more useful. I think u are from any master degree level student on Computer Science Student. Hope u will be better day by day. Thanks for all ur advice and tips on blog making.

    ReplyDelete
  4. Great one!

    In Dynamic Views is there a way to make a page title in the header-bar hyperlink to another website?

    This would help a lot!

    Thanks,

    Jon

    ReplyDelete
  5. Figured out how to do the thing i just posted. no need to answer. Sorry about that!

    thanks so much!

    ReplyDelete
  6. @Katio: All you need is passion, and the knowledge that you seek will find you by itself. I've had no formal education in the things that I blog about. Learnt them via World Wide Web :) I'm a MSc in Telecommunication Engineering student btw. And appreciate your wishes. Thanks a lot!

    @Jon Pennington: Seems like you're getting the hang of it. Good for you! :)

    ReplyDelete
  7. On FlipCard, Magazine, Snapshot, and Timeline views....the Google +1 button appears at the top
    left next to the arrows.

    Can it be moved back down to where the facebook
    & twitter buttons are?

    ReplyDelete
  8. @Anon: Technically, it is possible. Practically, it is not. When we move an object, we need to specify how far it should move. Since your post length always change (post1 might be 200px, post2 might be shorter, say 100px), it cant be done.

    ReplyDelete
  9. Is there a way to do this with only specific pages? Like in your example, what if I only wanted to group Static Page 1 and Static Page 2 together in a list called Static Pages and keep home separate?

    ReplyDelete
  10. @Anon: Nope, there isn't. It applies to all pages. There isn't an easy way to selective place static page links in a drop-down menu. Either all or nothing.

    ReplyDelete
  11. So now I have the 'head' pages and the possibility for a drop down menu. How do add more pages in the separate pages then???

    Or was this tutorial just to make the pages menu go from horizontal to vertical?

    ReplyDelete
  12. @Lady Guinevere: Well, this tutorial is purely cosmetic. You're right, it just changes the horizontal pages link into a drop-down menu. Add more pages like how you normally would.

    Cheers.

    ReplyDelete
  13. hello this is a totally different topic. I need your help. my gadgets on my right sidebar are not working when you click it. Please help!

    http://abinavarrete.blogspot.com/

    ReplyDelete
  14. @Abi: All your gadgets appear to be working fine, from my end. Tested with Firefox 8. If you can't click on your gadgets, and I could, the problem could be elsewhere, like your browser. If I were you, that's the first thing I'd do, to see if the gadgets are working in other browsers.

    ReplyDelete
  15. hello. it's me again. on the right side bar when you see the blog archive, clicking on the arrows are not working so my monthly post titles are not showing up if you click it.
    thanks!

    ReplyDelete
  16. www.mobileapps2.blogspot.com
    this is my blog
    m using dynamic views
    but its not showing the static pages
    plz help

    ReplyDelete
  17. @Abi: Right. Looks like your Archive gadget needs fixing. T'd suggest two ways.

    First thing first. Back up your template before you attempt any of the followings. Go to Dashboard - Template - Backup/Restore - Download Full Template - Save the resulting .xml file somewhere safe in your computer.

    1) Now, Go to Dashboard - Layout - Remove your archive gadget - Save Arrangement. Restart your browser, then re-add your archive gadget. See if it fixes your problem.

    2) If it doesnt, we'd go for a more extreme measure. But this method could reverse any hard HTML mods that you might have put in place in your blog. I can't tell if you have any. But fear not, since you've already backed up your template, you could always restore it should things go wrong. This is what you should do. Go to Dashboard - Template - Edit HTML - Proceed - Revert Widget Templates to Default - OK.

    All the best.

    @frenz: I can see your pages gadget just fine. Cheers.

    ReplyDelete
  18. hello. it's me again. I tried the two options you gave me but the problem is still there. :l

    http://abinavarrete.blogspot.com/

    ReplyDelete
  19. @Abi: I'd like to have a look at your template. Upload the .xml file that you've gotten (when you backed up your template) to a file hosting site, like rapidshare or megaupload. Leave the link to your file here. I'll download your template and see if I can figure what's wrong with it.

    Cheers.

    ReplyDelete
  20. Hi sorry for my late reply. you can download my template here:
    http://www.megaupload.com/?d=NTAFSSTL


    thank you!

    ReplyDelete
  21. hello sorry for my late reply.


    http://www.megaupload.com/?d=NTAFSSTL
    here's the link
    thank you and happy new year!

    ReplyDelete
  22. @Abi: Looks like it'll take longer than expected to fix your bug. Send me an email, and I will reply you when I have a found a fix. Click the link below, and fill in your name and email address. And just type somethings in the other fields.. That should get you in touch with my email.

    Contact Form

    ReplyDelete
  23. So I actually want the stretched out horizontal links for my pages, not the drop down menu, and for some reason now when I go to my blog it is always defaulting to flipcard and a drop down menu! Is there any way to have it always be in sidebar view and is there code I can put in so the pages links are spread across?

    ReplyDelete
    Replies
    1. Hi bobbie,

      The number of pages links that you have in your headers bar are too many to be displayed in a single line. That is why you're seeing an automatic-drop-down.

      As for the default view, yes you can set it to Sidebar view by going to Dashboard - Template - Customize - Template - Sidebar. You might previous customisation changes while changing to a new default view.

      Delete
    2. Is there a way to wrap the pages to a second line. i want all my pages to appear horizontally?

      Delete
    3. Hi admin,

      Making the pages gadget to go into multiple lines should not be an issue. But, the template script automatically places long pages link into a drop down menu, even if the multiple lines are configured. I still cant find a way to prevent this action.

      Delete
  24. Hi, how do i change the main pages (classic, flipcard, magazine, mosaic, sidebar, snapshot, timeslide) to drop-page-style. Mine just comes across as horizontal.

    ReplyDelete
    Replies
    1. The Strap, have you gotten this fixed? Coz I'm seeing a drown-down menu for your view options now:
      Screenshot

      Delete
  25. Hi Yoga, is there any way to change the drop down text 'Pages' to a different name? Like 'Contents' or something? Thanks a lot my man

    ReplyDelete
    Replies
    1. Hi Anon,

      I happen to know a way. 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 span:first-child{
      font-size: 0px !important;
      }
      #pages .menu-heading:before, .ss{
      content: "Contents";
      font-size: 15px !important;
      }

      Cheers!

      Delete
    2. You the man, for like always

      Delete
  26. thanks for all tutorials..

    i have one question, is it possible to move gadged dock to the navbar?

    thanx

    ReplyDelete
    Replies
    1. I don't see a way of that happening. If this is a non-dynamic template, it is possible. But not will at the element-fetching scripts that are running in DV.

      Delete
  27. hello! what if I like to view my header blog just like this

    http://tephrowe.blogspot.com/

    and not in drop-down?? how will I do that? please reply. Thank you! :)

    ReplyDelete
    Replies
    1. Hi Anon,

      If you're referring to having your Dynamic Views choices to go on a horizontal link list, then you need to remove your pages from showing. As long as you have pages showing, the view choices will be forced to go on a Drop Down menu.

      Delete
    2. Thanks for the reply but I don't have any pages. Just Home and the Dynamic views choices only

      Delete
    3. Can I have a look at your blog?

      Delete
    4. actually I'm a newbie. here it is http://dawnalalala.blogspot.com/

      Delete
    5. Hi Anon,

      Try this. Go to Dashboard - Pages - Show Pages as - Dont show.

      All the best! :)

      Delete
    6. aaww it's still the same.. btw it's alright thanks 4 your time! :))

      Delete
    7. That's weird. But don't worry, I'm not done yet. This will definitely work. Follow the steps in the following tutorial:

      http://www.southernspeakers.net/2012/04/hide-certain-pages-links-in-dynamic.html

      In Step 2, uncheck all your boxes and click Save -> Save Arrangement.

      Delete
    8. wahahah . I finally made it . Thanks you sooo much! :))

      Delete
  28. can i change the word "pages" from the top of the certain. please help

    ReplyDelete
  29. Hello! Is it possible to make a drop down menu-navigation bar in the dynamic views. For example, my navigation bar currently consists of the pages "Home" "About Us" "Get Involved", etc., but is it possible to add a sub menu to any of those?

    ReplyDelete
    Replies
    1. Hi there..

      Unfortunately, it is not possible to introduce any sort of content modification to the default drop-down structure at the moment. We'll keep our fingers crossed to see if this will be possible in the future, but with the way things are going, it is extremely unlikely.

      Delete
  30. i followed your instructions 1 by 1. but as i applied to my blog, all my header menu dissapeared.. T_T .

    ReplyDelete
    Replies
    1. Hi jiks,

      Remove the following from your template before trying the tweak above:

      .tabs{
      width: 62% !important;
      text-align: center !important;
      }
      #header.header .header-bar span.title{
      width: 74% !important;
      text-align: center !important;
      }

      Cheers..

      Delete
  31. hi yoga how make 2 or more drop menus with a different pages or links?

    ReplyDelete
    Replies
    1. Hi Mio,

      There can only be one drop-down menu for the pages/external links.. It is not possible to introduce a second one..

      Delete
  32. ¡¡¡¡¡¡Thanks!!!!!!! in Spanish are still very few tutorials about dynamic views.

    ReplyDelete
  33. Hi there, Thank you for the information. Although, mine didn't work. How can I put my Home Page to the left? Thank you for sharing us your knowledge..keep it coming!

    Cheers..

    ReplyDelete
    Replies
    1. Hi Lamielle,

      You're not using a Dynamic View template, whereas the tweak in the tutorial above is for Dynamic View templates only. As for your question, I'm not sure if I'm getting you right. Your whole front page of the blog is your home page. Perhaps if you elaborate more I might be able to help :)

      Cheers~

      Delete
  34. Hi there, thanks a lot for your help on blogger, it's really helpful!

    I have a quick question. Above you show how your static pages can be "summarized" under one drop down menu. However I would like to determine myself which ones I would like to feature a drop down menu and which ones not. I hope I make myself clear :) So basically, for example I would like to have one static page called "About us" and a second page called "Explore" with a drop down menu.

    Thanks in advance for your advice!

    Cheers

    ReplyDelete
    Replies
    1. Hi Judith,

      I understand what you mean, but unfortunately, it is not possible. Either you have them all in a drop-down menu, or none at all..

      Delete
    2. Hey Yoga, too bad :( Thanks anyway for your help! This resource rocks!!!

      Delete
  35. Hi Yoga! Thanks for the information. I really need your help. My menu changed for dropdown menu but I cant see all my pages. Is there any limit of pages do be shown in the drop-down menu? I have at least 5 missing.

    Thank You,
    Fernanda

    ReplyDelete
    Replies
    1. Hi Fernanda,

      Frankly, I'm not aware of any limitation on the number of links shown in the menu. Let me have a look. What's your blog's address?

      Delete
    2. i am missing two pages on my drop down menu. Any idea whats going on?

      Delete
    3. www.ginaslittlesecret.com i had to rearrange so two less popular pages were the ones not showing but it's still puzzles me.

      Delete
    4. Right.. Add this to your 'Add CSS' box.

      #header .menu:hover ul{
      max-height: 1000px !important;
      }
      #header .menu ul{
      overflow: visible !important;
      }

      Let me know how it goes. Cheers :)

      Delete
    5. Pat yourself on the back because you are absolutely amazing. Thank You very much.

      Question, can I have my pages go horizontally and wrap, i prefer they stay visible.

      again thank you

      Delete
    6. Sorry for the late reply. Unfortunately, whether or not you're seeing a drop-down menu depends on the screen-size that is used to view your blog. On large screens, the links would appear horizontally. Whereas in smaller screens (and minimized browser windows) the links would automatically resort to a drop-down menu. We can't squeeze the links horizontally if they're too long or too many.

      Delete
    7. СПАСИБО !!!

      Delete
  36. Do you know how to add my own navbar? Btw, your tutorials are awesome :)

    ReplyDelete
    Replies
    1. Thanks Tamara.. Unfortunately, you can't add a navbar to Dynamic Views.. You can, however, add the links that you'd commonly find a navbar to your Dynamic View template's menu bar by going to dashboard - Pages - New Page - Web Address.. I know this isn't what you're looking for, but this is the closest we have to an actual Navbar..

      Cheers :)

      Delete
    2. Ok, thanks a lot :)

      Delete
  37. thanks for this trick, very simple and easy

    ReplyDelete
  38. Hello. I love your tutorials, but after adding a few things like moving the sidebar to the left, removing the views, etc. But now every page except for Home shows as ;javascript and when I change the url's for the page, it immediately goes back to ;javascript.

    Would you possibly know how to fix that?
    Thanks!

    ReplyDelete
    Replies
    1. Hi Mike,

      There's a bug within the Pages gadget that's pointing the links to a null-pointer. The blogger team has been notified of the issue and they are currently working on it, though, I must say, it's taking forever.. I had to halt few of my tutorials that involve pages gadgets from being published while waiting for them to fix this gadget.. You might wanna use a Linklist gadget as a temporary substitute. If you're using a Dynamic View template, your Linklist gadget will appear on your gadget dock. Not ideal, but that's all we got for now.

      Delete
    2. Thanks for the info! That problem was getting annoying.. lol

      To get around it, I tried setting a statement to a Blogger page to redirect to the url that I originally wanted but it's only redirecting once in a while so I'll wait for a fix :)

      Delete
    3. Yeah.. Looks like there aren't many other options..

      Delete
  39. Hi!! Wat if i only want 'Static page1' and 'Static page2' under 'Pages' . And is it possible to change 'Pages' to something else?

    ReplyDelete
    Replies
    1. Hi Sudhaa,

      See the following links:

      http://www.southernspeakers.net/2012/04/hide-certain-pages-links-in-dynamic.html

      http://www.southernspeakers.net/2012/04/rename-pages-in-blogger-dynamic-views.html

      Cheers..

      Delete
  40. Hi yoga sorry to bug you.
    Let me explain my query again...sorry :(
    IF there are 4 pages in my header bar, say-
    Home, Facebook, Gmail, Twitter.
    I want to bring these pages - Facebook, gmail and Twitter under a new page 'Connect'.
    I want it to appear as-
    Home Connect
    in the header. What to do for this??? God!!! hope is made sense to you!!!

    ReplyDelete
    Replies
    1. Ah.. Right.. I think you're referring to a multi-level drop-down menu.. Unfortunately, there isnt a way to do this in Dynamic View templates at the moment. Just if you're wondering why, unlike the conventional templates, Dynamic Templates run mostly on scripts - that are hosted at Blogger's server. It isn't easy to make structural changes to DV templates due to this fact. For now, we are mostly limited to making cosmetic changes.

      Delete
    2. okie :(
      Thanks for the reply!!!

      Delete
  41. I added the code but I don't know how to create the drop-down menu?

    ReplyDelete
    Replies
    1. Hey Didier,

      Let's have a look at your blog. What's your blog's address?

      Delete
  42. I can't what you write in blog, please describe briefly.

    ReplyDelete
    Replies
    1. 3 lines of code. It doesn't get any shorter than that.

      Delete
  43. I want to add sub-menu under a specific menu... for example, in my blog http://newworldfree4u.blogspot.in/ , I want to add a new menu named "Movies" and when someone moves cursor on Movies or click on it, a drop-down should come showing sub-menu options like "300MB", "Bollywood", "Dual Audio" etc. Similarly, a menu option for "Songs" and its submenu should be "Mp3", "Video Songs". Hope you understand me...
    Please reply as soon as possible,, :) thnx

    ReplyDelete
    Replies
    1. Nope.. not even remotely possible with Dynamic View templates..

      Delete
  44. Hello Yoga can you please help me to change few things of my dynamic blog.
    I want to add few things like About Us, Home Etc And all to the header of my blog.
    Please help me

    ReplyDelete
    Replies
    1. Hi there,

      We can't add links to the header, but we can add them to the pages gadget. Let's have a look at your blog. What's your blog's address?

      Delete
  45. Hi Yoga is it possible to place subcategory to my blog's header bar? ty

    ReplyDelete
    Replies
    1. That depends. If you're referring to a Dynamic View template, unfortunately, the answer is no.

      Delete
  46. I'm actually trying to convert my header back to horizontal (not drop-down) and center my header bar and title image, but am having issues. Here is my current CSS:
    /* Hide search */
    .header-bar #search{ display: none !important; }
    /* Hide the google chrome feedback button */
    a.feedback { display: none !important; }
    /* Hide the home button */
    #pages ul li:first-child { display: none !important; }
    /* Hide the sharing controls */
    .share-controls { display: none !important; }
    #gadget-dock div.gadget-item:last-child, #spk{
    display: none !important;
    }
    /* Hide the views on the main page */
    #views { display: none !important; }
    /* Hide the views on the main page */
    #views { display: none !important; }
    /*Hide the vertical bar from before the first page link */
    #pages::before { border-left-width: 0 !important;}
    .ribbon{
    display: none !important;
    }
    #header .header-drawer.sticky, #header .header-drawer {
    top: 124px;
    }
    #header .header-drawer.sticky, #header .header-drawer {
    top: 84px;
    }
    #header .header-bar{
    height: 115px;
    }

    #header:hover .header-drawer, #header .header-drawer.open, .header-ssyby, body.viewitem-open #header .header-drawer {
    top: 115px;
    }

    #header-container {
    height: 155px;
    }

    .viewitem-panel .viewitem-inner {
    top: 50px;
    padding-bottom: 70px !important;}

    #header-container #header.header .header-bar span.title{
    background: url(http://2.bp.blogspot.com/-PxwdacttfDA/UmWRRuss3_I/AAAAAAAABRo/dm9wUjQCOGA/s380/COR+blue+website+header.png)
    no-repeat center;
    margin-left: auto !important;
    margin-right: auto !important;
    height: 115px;
    width: 740px;
    }


    .header-bar span.title a h1, .ss, #header .title a:hover{
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    }
    .header-bar span.title a h1, .ss, #header .title a:hover{
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    text-decoration: none !important;
    color: transparent !important;
    text-shadow: 0px 0px 0px transparent !important;
    }




    #items li, .article, .overview-wrap, .overview-inner, #content, .item.hentry.selected, .item.hentry.open, .item.ybyss, #feature, .overview-inner, .column .item, .viewitem-content {background: #add8e6 !important;}.items.hfeed{background: transparent !important;}
    .publish-info{
    display: none !important;
    }
    .blogger-gear, .overview-sspe {
    background-image: url('http://0.gravatar.com/blavatar/8a2d247dba5852d7c6d4c1668218447d?s=50&d=http%3A%2F%2Fs2.wp.com%2Fwp-content%2Fthemes%2Fh4%2Ftabs%2Fimages%2Fdefaultavatar.png') !important;
    height: 90px !important;
    width: 125px !important;
    }
    .entry-summary{
    text-align: justify !important;
    }
    .article .article-content { word-break: normal !important; }
    .title.entry-title{
    font-size: 30px !important;
    }
    .tabs{
    width: 97% !important;
    text-align: center !important;
    }



    #fold .item{
    width: auto !important;
    }

    #fold .has-thumbnail .story{
    min-width: 600px !important;
    }

    The blog is www.thecorpt.com, any help is appreciated!

    ReplyDelete
    Replies
    1. Hello there,

      It appears your bar has resorted to a drop down menu not due to some code, but because you have too many links in your pages bar. When you have too many links in your pages gadget (or just a few with really long title), your bar will automatically turn into a drop down menu, naturally.

      Delete
  47. hi yoga,
    i have created pages and gadget as well in my dynamic view template. but unfortunately only the first page which i have created is showing and rest of all the pages created are not visible in my header. can you please help me out.

    2. this is second question, i followed your code and generated dropdown menu for pages created but i need one more main tab which gives drop down. is it possible?

    ReplyDelete
    Replies
    1. 1) Have you checked the content of your Pages gadget to see if your other pages are checked to show, by going to Dashboard - Pages - Edit?

      2) Nope, not even remotely possible I'm afraid.

      Delete
  48. hello , how can i center the pages ?

    ReplyDelete
    Replies
    1. Hi there..

      See this:
      http://www.southernspeakers.net/2012/03/centering-header-links-in-blogger.html

      Delete
  49. Hello Yoboy! is it possible to have several drop down menus bud?

    also another topic, am I able to add images (fb,twitter,instagram,g+ icons) to the header bar on the right side where the home / edit buttons are in dynamic views?

    here is my page: http://shalmont.blogspot.com/

    ReplyDelete
    Replies
    1. Hello Shahiz,

      Unfortunately there's no way to add a second drop down menu. As for aligning your icons to the left, yeap it can be done. Here's an example:

      #header #pages, #pages.tabs ul{
      width: 100% !important;
      }

      #pages.tabs ul li:nth-child(9) a:link{
      position: absolute;
      bottom: 4px !important;
      right: 1% !important
      }

      Delete
  50. make 1 as a horizontal dropdown menu and list of links.
    and make 2 dropdown menu.

    ReplyDelete
  51. How can I add lebel list on the menu bar horizontally?

    ReplyDelete
    Replies
    1. It may take some doing, depending on the template you're using. Let's have a look at your blog. What's your blog's address?

      Delete
  52. Hi. I try to add the CSS code for my blog but I don't know why it's not working. The blog is this: http://scaenachescublog.blogspot.ro/
    I want the drop-down styled menu for my blog but the code you gave above is not working. Can you help me please?

    ReplyDelete
    Replies
    1. Hello there,

      I'm seeing a dropdown menu in your blog now. Have you got it sorted?

      Delete
  53. Hi, I'm just trying out DV and I love the look of it... and your blog is so helpful regarding DV for this non-techy person! My question is somewhat related to your post: Can I divert the gadgets that appear on my sidebar to appear in the horizontal header bar at the top of the page? I recently added some pages and saw that they appear in the header- that looks great and I would love for the other gadgets to display that way. Specifically, search bar and archive list. Is this possible? My blog is http://boundtogetherforchrist.blogspot.com. Thanks!!

    ReplyDelete
    Replies
    1. Hello Annette,

      Hate to be the bearer of bad news, but I'm afraid your pages are the only item that can appear in your pages bar in that way. Well, not exactly. You can actually add individually links to the bar by going to Dashboard - Layout - Click Edit on your Pages gadget - Click on 'Add External Link' - add the URL of your post. As you might have seen/guessed, you need to add things individually one-by-one - it is not feasible to add all your posts there. I think there is a limit of 20 items or something to your pages gadget as well. But hey, if you have favourite posts that you'd like to pin to your pages gadget, this would be how :)

      Delete
  54. Hi - I've been learning a lot from your articles! :)

    Is there a way to make the whole pages / views navigation bar stay in the same place? The header stays there but the Views / Pages bar disappears when you scroll down. Thanks!

    ReplyDelete
    Replies
    1. Here you go :)

      http://www.southernspeakers.net/2012/04/sticky-header-bar-in-blogger-dynamic.html

      Delete
  55. Hello! Thanks for all your great tutorials! They are apprectated!
    I have the dynamic view for my blog: http://floridacreate.blogspot.com/
    and my pages are in drop down menu which is cool, but recently they are showing up twice- not sure what I did?
    This is my CSS:
    .sidebar .item{
    background: #E4E4E4 !important;
    }
    #items.items li.item, .overview-inner, .magazine #content, .ss .item, .mosaic #content .item, .sidebar #content, #sidebar .item.selected, .timeslide .item, .viewitem-content {
    background: url('http://www.blogblog.com/1kt/transparent/white80.png') !important;
    }
    .overview-panel .article, .magazine #feature, .viewitem-panel .article, .sidebar #content .article{
    background: transparent !important;
    }
    #overview .overview-backdrop{
    opacity: 0 !important;
    }
    #items li, .article, .overview-wrap, .overview-inner, #content, .item.hentry.selected, .item.hentry.open, .item.ybyss, #feature, .overview-inner, .column .item, .viewitem-content {
    background: #99e4e8 !important;
    }

    .items.hfeed{
    background: transparent !important;
    }
    .viewitem-open #gadget-dock{
    position: absolute;
    width: 10px !important;
    overflow: hidden;
    margin-right: 56px;
    }
    .viewitem-open #gadget-dock:hover, .viewitem-open #gadget-dock.gadget-notifying,.ssyby, .viewitem-open #gadget-dock.gadget-opening{
    position: absolute;
    width: auto !important;
    margin-right: 17px;
    overflow: visible !important;
    }
    .flipcard .items .item .card .front, .flipcard .items .item .card .back{
    background-color: 33d6d6 !important;
    }
    .gadget-icons, .gadget-title, .gadget-content, #gadget-dock, .gadget-menu, .ss{
    background: #009eb7 !important;
    color: white !important;
    }
    .entry-content img{
    box-shadow: none !important;
    padding: 0px !important;
    border: 0px !important;
    }
    #gadget-dock{
    position: fixed !important;
    right: 0px !important;
    }
    .header-drawer .tabs{
    font-size: 40px !important;
    }
    .header-drawer .menu span{
    font-size: 15px !important;
    }
    #pages span:first-child{
    font-size: 0px !important;
    }
    #pages .menu-heading:before, .ss{
    content: "Contents";
    font-size: 15px !important;
    }
    .gadget-title, .ss {
    background: #333333 !important;
    color: white !important;
    }

    ReplyDelete
  56. Just checked the notify thanks!

    ReplyDelete
    Replies
    1. Hello Jane,

      I'm terribly sorry for the late reply. I've just checked your blog, and it appears fine - I don't see the double drop-down you've mentioned. Are you still seeing the issue?

      Delete
  57. Thank you for responding and checking- I also posted on Blogger forum and someone noticed I had Pages twice in the gadgets-so I deleted one!
    I'm still debating whether to switch back from Dynamic template- I like the look alot, but wonder if viewer's who are not as visual as me find it easy to search/find info

    ReplyDelete
  58. Hi Yoga, you are running a very helpful blog, thanks for it. I need one help, in my blog, I want to create multiple drop down list in Dynamic View. Is it possible? For example, one drop down menu under tourism, and another drop down menu under transportaion?

    ReplyDelete
    Replies
    1. Hi Saravan,

      I'm afraid there isn't a way to add custom drop-down menu in DV yet - at least not that I know of.

      Delete
  59. Hi, this was super helpful and I was wondering if there is a way to only have certain pages grouped together. For example 'Photography 1' and 'Photography 2' grouped under the heading 'Photography' but while 'Home' stays separate?

    ReplyDelete

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