Showing posts with label html. Show all posts
Showing posts with label html. Show all posts

Falling Snow Codes! Cause Christmas is here! (Special Event)


Turn you're blog into a Christmas Wonderland with this fun Falling Snow Codes. This are some Falling snow codes for you're blog, they belong to different websites.

Instructions:
→ Click on the source and follow the instructions of each website.
→ Remember to always SAVE your theme before adding any new code.
→ A preview of each "effect" will be show before the link.

1. FALLING SNOW EFFECT FROM: YUKOKI ○ (EASY)
Looking for a easy snow effect? This is the perfect code for you from Yokoku.Tumblr.
Link/Credit goes to his/her blog.

2. TUMBLRING.NET - FALLING SNOW EFFECT ○ (MEDIUM)
This website offers 3 different Snow Effects codes, each one with different style of snowflakes. Very easy to use, just copy-paste and follow the instructions the website offers. Visit the blog preview to see the snow-falling in action.


3. SNOW EFFECT BY THEME-HUNTER.TUMBLR ○ (EASY)
Looking for a easy, yet beautiful snow falling effect? This snow effect from Theme-Hunter is one of the best looking ones I have found in Tumblr. Go Try it! Preview Here

4. SNOWSTORM EFFECT BY SCHILLMANIA.COM ○ (HARD)
Know JavaScript? This tutorial is a bit more advance for the snow effect. You can adjust the snow speed, the amount of snow, the "wind", if and where it should stick (and if it should "melt"), and finally, whether the snow can react to the mouse moving (ie., "wind changes.")


5. SNOW EFFECT DREAMER X TUTORIALS ○ (EASY)
Don't want to waste your time reading? Well look no more, here's a Video tutorial made by DreamerxTutorials in Youtube. Enjoy.








Tutorial: How to re-size a image? using HTML

Hello Everyone! For this tutorial I'm gonna teach you How to re-size a image? using HTML, the easy way! For a quick definition of what HTML means you can visit our Tumblog-it dictionary. Here's a image of what you will be doing in this tutorial, trust me is super easy!

• First step is Log in your Tumblr Account. (of course! who doesn't know that?)

• Tumblr allows you to customize your images using different tools, you can write a message or change your template, whatever your doing, find the option that allows you to use HTML. For example in messages looks like:

While in the Template customization looks like:



• Now COPY the following code, and PASTE it wherever you want to have the image:


• Replace MY IMAGE URL, the width and height of this example.
• If you have no idea how to size your image, I made a few examples:


 (width) 100x100 (height)

 (width) 200x250 (height)

 (width) 400x250 (height)


Tips: Just play with the numbers till you reach the perfect size that you wish for! Let us know if this tutorial was helpful by clicking on the check-boxes below. Thank you.

Tutorial: How to show text when hover on image

Hello everyone!  This is a quick and easy-Tutorial: How to show text when hover on image. I try many HTML codes to see if they work in Tumblr and I found one that enables you to add text when someone hovers the mouse on the photo or image. Here's a quick look from my example blog:


Note: Code only works on a HTML theme. Not on posting messages.

1. First COPY the following code:


• Now let's add the code on your Tumblr Blog.
• Log into your Tumblr Account.
• Find the Account Settings. 



2. Now find the Website Theme  + Edit Theme.

PASTE the code where you want to have the photo: sidebar, top bar, etc. On my example blog I add the photo on the right-sidebar. Now you have to change some of the properties of the HTML code use the next photo as an example:



(click on the photo for a bigger view)


• Replace the Image URL with yours.
• Change the "Welcome to Tumblog-it! with the text you want to have when  a
visitor hovers on the photo.
• You can change the width and height however you want to.

• Click on Update Preview -- if you like it simply lick SAVE then CLOSE. It should look like:










Tutorial: Add Neon Light Text to your blog!

Hello Everyone! And welcome to another Colourful Tutorial for you Blog! Did you saw the Flash words above this comment? Wonder how to do it? Well is super easy! Let's start adding colour to your blog right now!

• First COPY the following code:


• Now Log in to your Tumblr.
• Find the blog that you wish to add the Neon Colour Text.
• Go to Blog Settings to start Customizing your theme. If you don't know how to find Customizing theme click HERE! for the tutorial.
• Click on EDIT HTML.
• Now PASTE the code where you want to have the Neon Words.

• We're doing to EDIT the text, how you do that? Easy! Find the words: Welcome to Dynamic Drive and change it with whatever you wanna say.
• And you're finish! Happy Blogging!

Special thanks to: dynamicdrive.com for the coding.

Tutorial: How to Add a Search Box on your Tumblr Blog

Here's a quick tutorial of how to add a Search Box for your Tags. Is quick easy and fun. Here's how the Search Box looks like:


Note: You can change the "Find" word with: search, Find me, what your looking for?, etc.


1. Let's start. COPY the following code, and PASTE it between the tags <head>  and </head>.


2. Now COPY this code - and PASTE wherever you want to have the Search Box. 







[coding courtesy of: tutorials.schmigs.com]


Tutorial: How to add a Link on your Description

If you ever wonder How to add a Link on your Description Box - is super easy!
How to add a Link on your Description - is a very easy and fast tutorial, all you need to do is:

1. Log into your Tumblr Account.
2. On the Top of the Page find the Blog Settings. The icon looks like a wheel- like in the photo:


3. Choose the Blog you want to add a Link to the Description and click on Theme Customize. If you don't know how to find it you can click on the Tutorial: Where is the “Customize Theme” Option?

3. Find the Description Box and type the following code: (you can copy-paste)
<a href=”url”>Link text</a>


4. Now replace
• url = with the url (internet address) that you want your visitors to visit
• Link text = is what your visitors are going to see on the blog.

5. After you finish changing the url and Link text - click on "Update preview" and if you like how it looks click SAVE then CLOSE. You just added a Link to your Description Box -- here's an example of how it looks like: