View Full Version : Blurb Badges & Placement
coleygm
Dec-12-2008, 10:24 AM
I have two Blurb Badges i have posted at the bottom of all my pages. The code i get from blurb was put in my Footer section.
Try as i might, i cannot get them to sit next to each other nicely. Right now one is simply on top of the other.
So if anyone can give me any advice on how to manipulate the positioning of the badges...i'd really appreciate it.
Even more ideally, is there a way to rotate or randomly put only one badge per page? As i start adding more badges, i don't want to have 10 of them on every page or anything...it'd be cool if you could just have one display rotating through all your Blurb books maybe???
digitaltheta.smugmug.com
thanks
Greg
ashishpandey
Dec-12-2008, 11:10 AM
Try as i might, i cannot get them to sit next to each other nicely. Right now one is simply on top of the other.
Add the following style to your blurb divs
display: inline-block;
Even more ideally, is there a way to rotate or randomly put only one badge per page? As i start adding more badges, i don't want to have 10 of them on every page or anything...
I have no experience with blurbs, so cannot tell if they have a random feature. But if you have 10 of them, you can show them selectively on a per gallery basis. Let's say you want to show a blurb only on the following gallery: http://sports.digitaltheta.com/gallery/6396707_uoCJA#413520621_5Zaid
then add the blurb as follows, with default display style set to none:
<div id="badge1" style="display: none; position:relative; width:120px; height:240px; padding:20px; margin:0px; background-color:white; background:url(http://www.blurb.com/images/badge/borders/dual-v-gray.gif) top left no-repeat;">
.....
</div>
And add following CSS to show it on the above gallery
.gallery_6396707 #badge1 {
display: inline-block;
}
EDIT: (note about IDs)
note that currently all your blurbs have the same id. It is a good idea to have the id's different. Something like badge1, badge2, badge3 etc. The above hack to selectively show a blurb in a gallery depends on unique IDs
caroline
Dec-12-2008, 11:38 AM
Sorry if this is not quite the same topic, it seems similar to me - I want to put an 'AddThis' button on my site, preferably somewhere sensible like in the navbar.
This is the code for putting it on a website:-
<!-- AddThis Button BEGIN -->
******** type="text/javascript">var addthis_pub = "carolineshipsey";</********
<a href="http://www.addthis.com/bookmark.php" onmouseover="return addthis_open(this, '', '[URL]', '[TITLE]')" onmouseout="addthis_close()" onclick="return addthis_sendto()"><img src="http://s7.addthis.com/static/btn/lg-addthis-en.gif" width="125" height="16" border="0" alt="" /></a>******** type="text/javascript" src="http://s7.addthis.com/js/152/addthis_widget.js"></********
<!-- AddThis Button END -->
I have put it in the body section of my customization which seemed to be the instructions and it appears in the top left hand corner of my pages. Firstly, have I put the code int the correct place and how do I position it ?
Caroline
denisegoldberg
Dec-12-2008, 12:28 PM
Sorry if this is not quite the same topic, it seems similar to me - I want to put an 'AddThis' button on my site, preferably somewhere sensible like in the navbar.
I have put it in the body section of my customization which seemed to be the instructions and it appears in the top left hand corner of my pages. Firstly, have I put the code int the correct place and how do I position it ?
Caroline -
Where do you want the button? At the end of your navbar?
I just played with this in web dev. I removed the button code from it's current location, and I pasted it after the blog entry in your navbar.
Here's the end of your navbar code with the AddThis button added after your blog entry:
.......
<li><a href="/keyword" title="Start Looking Here for Images">Find</a></li>
<li><a href="http://caroline-shipsey.blogspot.com/" title="Blog From the Fog">Blog</a></li>
<!-- AddThis Button BEGIN --> ******** type="text/javascript">var addthis_pub = "carolineshipsey";</******** <a href="http://www.addthis.com/bookmark.php" onmouseover="return addthis_open(this, '', '[URL]', '[TITLE]')" onmouseout="addthis_close()" onclick="return addthis_sendto()"><img src="http://s7.addthis.com/static/btn/lg-addthis-en.gif" alt="" width="125" border="0" height="16"></a>******** type="text/javascript" src="http://s7.addthis.com/js/152/addthis_widget.js"></script (http://s7.addthis.com/js/152/addthis_widget.js%22%3E%3C/script)> <!-- AddThis Button END -->
</ul>
Update a little later - after you saw my post an copied the code... Yikes! I should know better than pasting code into dgrin. The forum software apparently saw fit to replace some of the words with ****. You'll need to grab the button code from the addthis site again. Sorry to be the cause a problem...
If you want it somewhere else, you could add a div for the button and position it with CSS.
--- Denise
caroline
Dec-12-2008, 12:46 PM
Hi Denise,
I have put the code where I believe you intended but its not working for me :-( - So whats new :scratch I've left it there so you can see what has happened.
Thanks for looking
Caroline
denisegoldberg
Dec-12-2008, 12:50 PM
Hi Denise,
I have put the code where I believe you intended but its not working for me :-( - So whats new :scratch I've left it there so you can see what has happened.
Thanks for looking
Caroline
Caroline -
I just added a note to my post above, plus sent you a pm.
It looks like the forum scrambled the code when I put it in the post. There are ****** instead of things like <script.
You'll need to pull the code from the add this site again. You should be all set after you paste in the code without the ******'s.
I apologize for leading you astray!
--- Denise
caroline
Dec-12-2008, 01:01 PM
Thanks very much Denise - Its fine now :thumb
Caroline
coleygm
Dec-13-2008, 01:52 PM
[quote=ashishpandey]Add the following style to your blurb divs
display: inline-block;
You rule Dude...THANKS!
ashishpandey
Dec-13-2008, 07:13 PM
[quote=ashishpandey]Add the following style to your blurb divs
display: inline-block;
You rule Dude...THANKS!
Thanks :thumb
FYI, I have edited my post above to correct a problem with my second suggestion (regarding showing blurbs selectively on a single gallery)
coleygm
Dec-16-2008, 12:05 PM
[quote=coleygm]
Thanks :thumb
FYI, I have edited my post above to correct a problem with my second suggestion (regarding showing blurbs selectively on a single gallery)
hey...i went in and looked at my site again today, and suddenly the badges are back to being on top of one another again...WHAT GIVES? My new snip of code is still listed:<div id="badge" style="position:relative; display: inline-block;width:120px;....
so why is back to being on top now i wonder?
any thoughts are greatly appreciated.
digitaltheta.smugmug.com
thanks
sry407
Jul-08-2009, 10:58 AM
I know this is an oldie...but does this code work for anyone else? I'm trying to get my Blurb book to only be displayed in the associated gallery, not on every page. This code just isn't working for me though for some reason.
Has anyone else had luck with this?
Add the following style to your blurb divs
display: inline-block;
I have no experience with blurbs, so cannot tell if they have a random feature. But if you have 10 of them, you can show them selectively on a per gallery basis. Let's say you want to show a blurb only on the following gallery: http://sports.digitaltheta.com/gallery/6396707_uoCJA#413520621_5Zaid
then add the blurb as follows, with default display style set to none:
<div id="badge1" style="display: none; position:relative; width:120px; height:240px; padding:20px; margin:0px; background-color:white; background:url(http://www.blurb.com/images/badge/borders/dual-v-gray.gif) top left no-repeat;">
.....
</div>
And add following CSS to show it on the above gallery
.gallery_6396707 #badge1 {
display: inline-block;
}
EDIT: (note about IDs)
note that currently all your blurbs have the same id. It is a good idea to have the id's different. Something like badge1, badge2, badge3 etc. The above hack to selectively show a blurb in a gallery depends on unique IDs
vBulletin® v3.8.5, Copyright ©2000-2012, Jelsoft Enterprises Ltd.