Tutorial-Baby @tutorial-baby - Tumblr Blog

tutorial-baby

Halloween Link Hovers

add before <head>:

dripping blood link hover:

bouncing pumpkins hover:

flying bats hover:

pumpkins and bats hover:

tutorial-baby

Border on the bottom of your blog

It’s a bit more complicated than a regular border, but this is what I figured out:

Add this under <style> or <style type=“text/css”> and add your image URL where it says IMAGEURLHERE

Add this code under </body> and add the same image URL

EDIT: To make the border go in front of your posts, add

z-index: 99999999999999;

after width: 100%; in the first code

tutorial-baby

How to have an expanding update box on the bottom of your blog

This one comes with a glitter border, you’ll have to add the cool font on your own though!

live preview//code

Just put the code under <head> and enjoy!

#gonna boost my old codes #i kind of want to redesign all of these to fit current aesthetics instead of being stuck in 2013

So in this post I showed you guys how to create tooltips, little blurbs of text that appear when you hover over a link. How about shaping them to look like speech bubbles?!

This tutorial is for if you don't already have tooltips installed in your code. For ease of use, if you want tooltips that are shaped like speech bubbles and you already have tooltips in your theme, go back and remove the tooltip code!

Now you're ready to add in this feature.

1. Add this under <head>:

2. Use this instead of your links (replace the quotation marks, and if you're confused, reference my original post!)

<a title="tooltip text" href="linkURL">link title</a>

There are instructions in the code in the iframe (that weird little box I use to deliver the code in this post) on customizing this tooltip!

(I learned how to do this by editing a code from here!)

#tooltip #tooltips #free codes #tutorials #web coding #tutorial blog #code blog #tooltip code #speech bubble #speech bubble tooltip #bubble tooltip #link hover #link effect #link caption #html codes #customize your tumblr #i hope that code shows up in the iframe it's not working in preview!!

strawberry-garfield

it’s official

Floating Nav Box #2

Hey guys!!

Here's a new floating box for your links! Like the last one, it uses tooltips for labels, so if you already have tooltips installed in your blog follow the directions in the code to remove what's gotta go :) I think this one looks best on minimal style blogs or art blogs, I'm a big fan of the pixels. And as always it is easily customizable to fit any blog type. Enjoy!

live view

Includes:

-8 spots for links (and to add more, just copy the link code that repeats under <div id="peex">)

-strip that turns pale blue on hover

-pixels that have a lavender background on hover

code:

here are the pixels I used-- downloaded from a free photoshop pack (uploaded as pngs)

#links #floating box #link box #nav box #navigation #nav page code #links page #blog extra #tooltips #tooltip code #minimal #pixels

Hello! Really helpful tutorials! I was wondering if you knew how to insert a slider to your page? :)

Thank youu! And a slider? I think I have an idea of what you mean, but can you link me to a few examples?

#slider #Anonymous

How do you make sure your blog shows the tags for your posts?

Right now I think yours is doing that, whereas my tags only show on a posts's permalink page. To make your tags show on your index page, find your posts section under

which is generally {block:Posts}, then find under that section where the index page is coded. In my theme, that's easy to find, and it is {block:Indexpage}. Here is where you'll find notecount codes, permalink and rebloglink codes. To add tags to your index page posts, place this code before {/block:Indexpage}

{block:HasTags} tagged as: {block:Tags}{Tag}{/block:Tags}{/block:HasTags}

This can differ from theme to theme but every theme has these sections under

categorizing post types, and it is in those post types-- and more specifically, in the section of the post section that codes for the index page-- that you can add viewable tags.

If you can't see them, try adding a font color and size using html tags! Just like sometimes the assets from other objects in the theme are transmuted to these new codes (making them invisible or illegible) .

#adding tags #tags to indexpage #tagged posts #viewing tags #fightingdreamer34

Is there a way to have two sidebar images on one page? Lovely blog btw!

Yes of course!

There are a few ways this could be done. You could insert the image into your html, using But that leaves the image unformatted.

You could put that code within an existing div, so it’s being formatted just like the other sidebar image.

You could create a new div, which means you’re working under and <body> to format and place your new image.

You could also do any of these things but instead of using a URL for your image, you could upload it from your own computer, then use that code instead of the image URL. You still have to format it like you would the image URL though! To be able to upload any image, add this under with your meta names:

and then use this where you want your image to appear:

Let me know if I can help you more specifically! Themes differ in formats and divs, so this sort of thing really depends on each theme. This is hopefully a general answer that still sheds some light haha

#sidebar images #sidebar #insert an image #codes #sidebar image #two sidebar images #sevenylime

Hello friends, summer's here!

So I'm home for the summer now (just finished my freshman year at art college!!), and even though I'm really busy with job hunting/apartment searching/work etc, I've been wanting to take some time and post a few new tutorials!

For this purpose I want your input-- I'm gonna reopen my ask box for a few days minimum and see what you guys want to learn (while I learn, too!). Some new kind of sliding tabs? Nav boxes? Custom pages? New tooltips? Post hovers?

I figure that for everything that I see on tumblr you guys have seen something twice as cool somewhere else on tumblr, so I wanna hear from you!

http://tutorial-baby.tumblr.com/message

I'll also be able to take some time to answer various questions, but remember to check my pages and search the tags for what's already been answered or posted :)

What tutorials do you want me to post this summer?

#also we're almost at 400k hits!#wow you guys are great :)

Basic Tooltip Tutorial

I've been meaning to make this for a while now! It includes the basic tooltip code with notes on how to customize it (that are inside the code!) I'll make a post about some pre-designed tooltips soon too :)

What are tooltips?

For those of you who don't know or haven't seen them, tooltips are the labels that can appear when you hover over links. It's a nice touch to make your blog look unique or cohesive, and it's also useful if you want to use symbols for your links but also want a label to appear when you hover on the symbol (so people know what they're clicking).

TO USE A TOOLTIP:

Your links, in html, look like this:

<a href="linkURL">link title</a>

to start using tooltips on your links, change that format to this:

<a title="tooltip text" href="linkURL">link title</a>

Basic tooltip coding for a tooltip that looks like this:

Add this under <head>

2. Follow the "USE A TOOLTIP" steps in the beginning of this tutorial!

#tooltip #basic tooltip #link hover #tooltip tutorial #tooltip code

Hey everyone!

Sorry to bring this news but I have to close my ask box for a while. I was expecting to have all this time and energy to get through a lot of questions this break, but I've ended up with this strange bronchial illness that's leaving me super exhausted (led to a trip to the ER...bleh)

My next semester starts on the 14th, so hopefully I'll be back soon to fill up some of that beginning of the semester free time that goes missing by the middle/end!

Love you guys, thanks for being supportive, I wish I could help you all more currently :) <3

x Abbey

If that's you on your icon pic on the left, then you are absolutely gorgeous!! Are you from Japan? :)

Ohh no that's not me on the left! That's Marina from Marina and the Diamonds :) My picture is far down on the right sidebar! I'm not from Japan though, I'm in the US, currently Maine.

But hey guys vacation is in like two days for me! Then I can get to answering some more questions and hopefully start writing some new tutorials and codes for fun, it's been way too long. :)

#Anonymous

Hey, I'm trying to delete the note count on my posts. I've tried just about everything I could in the html and I can't figure it out. My theme is from dolliecrave. If you could help, that'd be amazing.

Go to your html and search " {notecount} " or " {notecountwithlabel} " or "notecount", and see if you can find those tags in the section of your html under . Anywhere that those tags are are going to be where your note count is displayed, so depending on which ones you delete will erase the note count from your image posts, or videos, etc! Just pay attention to what is around that {notecount} tag to know what you're erasing the note count of.

#note count #littlebit-liberal

The code for rounded corners on images is working - on single image posts. Any hints on getting it to work for multi image posts/ all images on my page?

You'll have to add the code for rounded corners to your post code, not just your image post code! That should cover it. If your multi image posts still aren't affected, you might have a separate code for photosets in your theme, in which case you can try adding the rounded corner code to that as well (and that should really cover it then!).

#photoset #rounded corner #rounded corner code #corner effects #post effects #teo-teskator

Hii! I want this - ♔ LA BEAU PARADIS - (my tumblr title) to be a link to my homepage but I don't know how to do it, I was looking for some code or anything all over the internet, but there are only tips how to make banner a link.. Thanks for answer!

You can add a nav link either in your html or as a redirect page! Then just use your text for the link title. This would be added to your main links/navigation. To find your navigation, search "home" in your html (or another link title) and that's where you can add a new link

#labeauparadis

r u still doing the blogmakeover giveaway?

nooo that was long ago! Months ago at this point.

#Anonymous

Trending Blogs

Recently Viewed Blogs

Tutorial-Baby