 |
| Before |
 |
| After |
When you have more static page links than what your header-bar can fit, all your pages will be
forced to go on a drop-down menu. This drop-down menu will be titled 'Pages', by default. Here's how you can change it to other text of your likings.
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;
}
In this example, I've changed 'Pages' to 'Contents'. Feel free to personalise it by changing Line 5.
Wow, good tutorial ! Keep it up bro.. :)
ReplyDeleteCheers mate..
DeleteIs there a way to have some drop downs and not others ie
ReplyDeleteLocations About us Facebook Twitter
(drops down to)
Cornwall
Devon
Pembrokeshire
Hope that makes sense!
I get what you mean, but it isn't possible. It's either all or nothing. We can't have some inside the drop-down and some outside.
DeleteI have some questions to this tutorial :) I have only links to change the view of my template. They are organized horizontally, not in drop-down menu, and I don't know how to do that. Also I don't know how add additional links (already searched your blog but could not find how to do this). And can I change the names of links like "classic" on some other?
ReplyDeleteHi Phoe,
DeleteSorry for my late reply. I see you've added pages to your blog. As for renaming the Dynamic Views, I can think of a way. But this will only change the names on the drop down menu, not the selected link. For example, say you change 'Flipcard' to 'Thumbnails'. Once selected, though in the dropdown it'll show as 'Thumbnail', it'll still read 'Flipcard' on the main blog. Do you wanna proceed?
Yes, I would like that :)
DeleteHi Phoe,
DeleteHere you go:
#views.menu ul li a, .menu-heading{
font-size: 0px !important;
}
.menu-heading:before{
content: "Views";
font-size: 15px !important;
}
#views.menu ul li.Classic a:before{
content: "Rename1";
font-size: 15px !important;
}
#views.menu ul li.Flipcard a:before{
content: "Rename2";
font-size: 15px !important;
}
#views.menu ul li.Sidebar a:before{
content: "Rename3";
font-size: 15px !important;
}
#views.menu ul li.Timeslide a:before{
content: "Rename4";
font-size: 15px !important;
}
Change Rename1, Rename2, Rename3 and Rename4 accordingly. Cheers!
Hi, i was translating all these dynamic views. But i couldn't do that last 2 types. Snapshop, timeslide. They were seen invisible.
ReplyDeleteHelp me guys, look at here: successwithub.blogspot.com
Hi UB BU,
DeleteI can see the last two links fine. Have you got it sorted? In any case, try clearing your browser's cache/cookies.
Hi,
ReplyDeleteI am using the snapshot view on my blog but I wanted to create a new page which will allow me to have individual posts rather than one post for the page. The whole idea is to have a gallery of snapshots on a new page. Is there anyway this can be done?
Hi Anon,
DeleteYou can't publish posts in a page.. However, you can categorically combine a group of posts, and have them shown as a gallery of snapshots..
The steps:
1) Publish posts like how you normally would
2) Give a unique label to posts that you're grouping (the posts that you'd like to see in the gallery)
3) Get the label's direct link.. It should look something like this: http://yoboy-12.blogspot.com/search/label/update
4) Go to Dashboard - Page - New Page - Web Address - Add the link to your unique label there..
You should now have a link in your menu bar that shows a group of your posts in snapshot view..
All the best :)
Is there a way to rename "Sidebar" to something else?
ReplyDeleteHi Zandia,
DeleteTry 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.
#views.menu ul li a, .menu-heading{
font-size: 0px !important;
}
.menu-heading:before{
content: "Views";
font-size: 15px !important;
}
#views.menu ul li.Sidebar a:before{
content: "Sidebar";
font-size: 15px !important;
}
Rename 'Sidebar' in the code above to something else, as you wish :)
Thanks Yoga.
DeleteThe only view I'm showing is 'sidebar' and I tried renaming it 'videos' with the code above and it's not working for me for some reason.
http://zwow-warriorz.blogspot.com
Hi Zandia,
DeleteSorry bout the earlier code. Here, this one should work:
#views ul .Sidebar a{
font-size: 0px !important;
}
#views ul .Sidebar a:after{
content: "Videos";
font-size: 14px !important;
}
Cheers :)
That worked perfectly! Thank you!!!
ReplyDeleteExcellent! :)
Deletehi thanks so much for all of your brilliant tutorials!
ReplyDeletei was wondering if there is any way to limit the posts shown on my home page?
I am able to do that on other pages through your label trick as listed above, but can't figure it out for 'home'.
any suggestions?
thanks very much
emily
Hi Emily,
DeleteIf you're referring to your Dynamic View homepage, I'm afraid we can't control the number of posts shown on the main page. Note that in Dynamic View, posts are loaded dynamically. There's no way to define a static attribute for this. I'm sorry I couldn't be much more of a help..
Emily, I was able to accomplish this trick by using a custom label (promo) and a home-page redirect based on a search for that label.
DeleteNow only posts that have the promo label will appear. I can change the post dates to rearrange the order I want them to appear.
Note my 'home page shows up as "http://www.robbmontgomery.com/search/label/promo."
You make the home page redirect change in Search settings. Yoga talks about that elsewhere on this site.
Robb
hi Yoga,
ReplyDeleteis there a way by which the posts in blog appear in reverse chronological order?
Thanks in advance.
Hi Anon,
DeleteUnfortunately, there isn't a feasible way to get this done, except to manually change the date of each post (use a newer date for older post)..
Hi,
ReplyDeleteI've been struggling to setup an online gallery and thought of using the Dynamic view "Flipcard". I went through your tutorial and another one and have customized the page. The page link are search links to the Labels that will be on the page.
Here is my problem: Once I click on the "Page" link.... the bar looses all my page links and puts in the different views. I've pasted the code to remove the view but I'd like to have the Pages link!
I hope that I am not confusing you. I have added a few posts for testing.
Thanks in advance
I'm also trying to get the Label i.e. the Page name to be displayed so that people don't feel lost.
ReplyDeleteThanks a lot
Hi Barney,
DeleteSorry for the late reply. I'm gonna have to take a look at your blog, to really understand what's going on - before I can suggest something useful. What's your blog's address?
Cheers :)
I just realized that I didn't put in the link. Here it is: barneyjosephgallery.blogspot.in
ReplyDeleteSorry for looking like a spammer!
Hi,
ReplyDeleteIts barneyjosephgallery.blogspot.in
Hi Barney,
DeleteSorry for my ridiculously late reply. I've seen your blog, and this is what I've gathered.
1) Your current default view is Flipcard. If you'd like your labels to show in flipcard view as well, simply use the following format for your label links:
http://barneyjosephgallery.blogspot.com/search/label/Digital
2) If you want your label page to load in a non-default view (classic for example), then use the following link:
http://barneyjosephgallery.blogspot.com/search/label/Digital?view=classic
Let me know how it goes :)
Cheers and God bless..
Hi,
DeleteI want the links to open in flipcard view. I've saved the links as such:
http://barneyjosephgallery.blogspot.com/view/flipcard/search/label/Digital
So this way the page also loads in flipcard view and all the posts related to the tag can be shown in one page. But once the new page is opened, my links are gone. To see the entire gallery I'll have to click the "header"(if that's what it is called). Plus there is no way of telling the user by way of a page title or something that they are looking at all posts under a certain label. This is what I am trying.
Any hope? Thanks a lot in advance :)
Hi Barney,
DeleteHave you seen my previous reply. I've provided two possible fixes. Have you given them a try?
To cap what I've said in my previous reply:
1) This isn't gonna work:
http://barneyjosephgallery.blogspot.com/view/flipcard/search/label/Digital
2) Use one of the followings:
http://barneyjosephgallery.blogspot.com/search/label/Digital
http://barneyjosephgallery.blogspot.com/search/label/Digital?view=flipcard
And nope, there isn't a way to tell your readers that they are looking at a particular label page.
Hi,
DeleteThanks for your help... the links worked! I had the wrong format for the links I guess. The old link format seemed to work in terms of search but somehow wiped out my links in the new page.
You linking method works and "I am eternally grateful". Do check my blog in a few days and I shall have it all ready :)
I looked into your other blog when I was searching for your blog's address previously, and saw that awesome Batman DIY figure. It's cool. You did a good job there! :)
DeleteThanks :)
Deletehye Yoga,
ReplyDeleteim currently working on my online shopping blog using Dynamic View template. almariannisa.blogspot.com I dont know whether its suitable or not cos i never find any online shopping using this template.Anyway I just tried.
OK.My problem is i did follow your tutorial on how to post publish post in pages.it works but when viewed in classic you can still view the same post and its kindda duplicate. is there anyway to delete/hide it? then i want the default view in snapshot but when on mobile the blog still appear in classic view.how to set this?
i would like to follow like homeofkhalifah.blogspot.com but he has a post in pages with a drop down (vertically) but i want to make it horizontally like you can see in my blog. please help yoga. thanks!
Hi Annisa,
DeleteDynamic View templates are shiny and eye-catching. If you've successfully set up your online shopping blog (with no noticeable issues) with a Dynamic View blog, you could just stay on it and see how it fares.
Now, as for publishing posts to pages. It's true that your posts will appear twice - one under the homepage, and one under the pages gadget. Unfortunately, in Dynamic View templates, there isn't anything we can do about it. But in a non-dynamic template, there is a tweak that will allow you to hide your posts from appearing in your homepage: http://www.southernspeakers.net/2011/08/hide-certain-posts-from-blogger.html
As for settings Snapshot in your mobile view, try this. Go to Dashboard - Templates - Click the 'Gear Icon' under the mobile preview - Choose mobile template - Custom. Note that in order for this to work, your current default view in web-mode needs to be set to Snapshot as well.
In homeofkhalifah.blogspot.com, the links in his drop down menu are of static pages, not posts (no trick involved). He has just created usual pages by going to Dashboard - Pages - New page - Blank page. As for letting it appear horizontally, I'm afraid this isn't something that we can control. The links will automatically resort to a drop-down mode if the viewer's screen isn't wide enough to accommodate all of the links. In other words, you might see a horizontal link lists in your pages gadget, but someone with a smaller device (iPad, Samsung Tab, etc) will still see a drop-down menu.
Hope these answers help. Cheers and God bless :)
How about to changes the name of views menu like as (1)flipcard, (2)sidebar to be (1)File, (2)Forum. Thanks to attention before and please help me as soon as possible to solved this problem I hope it can be done :D
ReplyDeleteHi Deby,
DeleteUse this:
#views.menu ul li a, .menu-heading{
font-size: 0px !important;
}
.menu-heading:before{
content: "Views";
font-size: 15px !important;
}
#views.menu ul li.Flipcard a:before{
content: "File";
font-size: 15px !important;
}
#views.menu ul li.Sidebar a:before{
content: "Forum";
font-size: 15px !important;
}
Cheers :)
Thank you so much .. I'm so very delighted now it's so very helpful for me thx Yoga.
DeleteHi Deby,
DeleteDon't mention it :)
Cheers..
Sorry if I ask too much of you but it is equally important to maximize the functions of my Blogger. The question is how to protect a page or a post with a password on dynamic views ?
ReplyDeleteThx .. :D
Hi Deby,
DeleteI'm not sure if such thing is even possible. Are you referring to password-protecting right-clicks? In any case, it looks like it's gonna involved some sort of serious scripting. I'm afraid I'm not that good in advanced scripting..
Oh so yeah I see so well. So Is this template provided in the hosting and domain services are paid generally to integrated of auto installer services such as Softaculous existing on cpnel?
ReplyDeleteI'd love to have this template with full permissions if it is possible to allow me the give a protection with a password of any page or post I want that is highly privacy.
Hi Deby,
DeleteTo be honest I haven't got the slightest clue. Is that what they're claiming to offer? You could try shooting your question at Blogger's Help Forum, to see if there are any other users who have tried these services you're referring to. You might find some helpful reply there (at times).
Cheers..
Okey Yoga, so I'll tray first. Thx!
DeleteSorry I talk a lot. But anyway How can I make on each page appear directly on the scroll that I specify ?
ReplyDeleteHi Deby,
DeleteI'm afraid I'm not following. What do you mean by placing page on scroll?
I am so confused to explain it, hehe .. sorry my english is not so good, I am from Indonesia. How if you do not mind and then so you can see my blog at debyferdian.blogspot.com ^_^"
DeleteHi Deby,
DeleteSee if this is what you're looking for.
http://www.southernspeakers.net/2012/09/scrollbar-for-sidebar-posts-in-blogger.html
Or, you could use a screenshot to explain your issue better, that could speed things up.
Cheers :)
It's might with these screenshot I hope can be the explain it. Check it out : http://3.bp.blogspot.com/-oj3xt1hE2zs/UQO1I_byeDI/AAAAAAAAAKU/sFease-qLkg/s1600/trouble.jpg
DeleteHi Deby,
DeleteI'm not sure if we can lock the scroll bar at a default position upon loading a page. Even if it is possible, it sure will be challenging in Dynamic View templates. As for the Facebook widget questions, I'm afraid this is something that you need to run by the Facebook developers. There's nothing much we can do at Blogger's end.
Cheers.
Hehe .. Thanks Yoga I see but I think I doing good today because I found the scripts similar like was I mean but one more time still have a problem more such as :
Delete1. The page of pages always following the post pages.
2. How do I integrate the footer area as "Posted" and "Labels" and give the margin top or separator an above of publish info ?
3. How to add a profile avatar of the author next to the information publishers?
If you are not heavy to check again my page.
4. How to sticky the tittle of article like as a header bar position so then it can't be scroll ?
Delete5. How to changes the function of "feed back" to be "comment" with go to bottom function ?
6. How to add the button control "next & previous page" on the fix position bottom left ?
Sorry I so lot ask question continously to you but please help me .. :D
I could releasing my question of number (1) I had resolved that by these like code :
Delete.article.hentry.html_code{
margin-top: 80px;
}
beforely I using these code :
.article{
margin-top: 80px;
}
Hi Deby,
DeletePlease use Blogger's Help Forum if you need quick answers for all these queries. Not that I don't want to help you, I seriously find myself incapable of following several questions at once. Not to mention, since each question is unique, and not entirely clear, more time is needed to be spent for each one of them. For now, let's focus at one question at a time.
Seems like you've already got your first question sorted.
As for your next question, I'm not quite following. Do you mind elaborating or include a graphical screenshot to explain it better?
Hi Buddy,
ReplyDeleteNice tutorial amongst the nicest one's around... Got know that I can do this as well!!
Woa just going crazy after knowing that I can also do this on my Blogger :-)
This my blog: http://ultimatewebdevelopmenttutorial.blogspot.in/
Thanks a lot for this.
Glad to be of help Sumesh, have fun around!
DeleteCheers :)
hi, can I ask..?
ReplyDeletewhy all my 'page' not shown on dynamic views?
just some of them, the rest is go to linkbar on the side..
hope you understand my bad english
Hi there,
DeleteI'm not quite sure what the problem is, but you can always edit your Pages gadget and manually add these links. To do so, go to Dashboard - Layout - Pages - Edit.
Cheers :)
This comment has been removed by the author.
ReplyDeleteI'm afraid it is not possible
DeleteHello, your tutorials are amazing! Thanks!
ReplyDeleteI was wondering if you could help me. I'm using the Snapshot Dynamic View, but so far I have been unable to add Pages to my Header Bar. I have the Pages gadget present in Layout. However, when I click "Show pages as: Top tabs" it keeps reverting back to "Side links"... and the pages don't even show on my blog in any case. I don't understand what the problem is and am stumped! I have switched between dynamic views to see if this changes, but to no avail.
Do you know what the problem is? Thanks for your time :)
It has always been a hit-and-miss thing, in my experience. Anyways, may I have a look at your blog, in its dynamic mode? You could create a test blog to replicate the issue there, if you don't want to work on your actual blog.
DeleteI have my own customized menu, how can I add drop down menu to required menu option.
ReplyDeletehttp://ourptc-sites.blogspot.in
This is the closest you can get to a drop down menu in Dynamic Views. You can't customize it:
Deletehttp://www.southernspeakers.net/2011/11/drop-down-pages-gadget-menu-in-blogger.html
Hi i have a different problem with dynamic views i would like to change the order of the pages but the page gadget doesnt work any ideas ???
ReplyDeleteHello there.
DeleteHave you tried going to Dashboard - Layout - Pages - Edit?
Can u say us on how to remove dropdown page list from mobile in blogger....
ReplyDeleteplz reply us on my email id...
thanks...
The mobile template is not editable, unfortunately.
Deletehow to create drop down menu in blogger without java script?
ReplyDeleteTo be honest, I do not know. This is out of my area of expertise. Have you tried searching for one of these tutorials?
Deletehow do i get to show my blog pages in header-bar?
ReplyDeletei already removed all the View options from the header as you taught us in a previous post but i dont get to show the blog pages instead
Have you added your Pages gadget? You need the pages gadget to show your static pages.
DeleteHey Mate, all the work you did here, great job!
ReplyDeleteI am working on http://amazingmacaques.blogspot.com/
ReplyDeleteAs you can see in the menu bar, I have the "classic" and the "Content" options... But I would like to have more, so it is easier for people to navigate to what they want to read.
So I added four page-gadgets:
Home - About Wild Macaques - Macaques at Home - Research
Now, for example, Home is stand-alone, but the next three contain several individual pages.
Is this possible to do?