넌 벼룩이야

via a-pocketful ,org. a-pocketful
#custom ask box
#tutorial

— How to add an ask box to your FAQ page.

OR TO ANY OTHER PAGE IN GENERAL

How to make a custom ask page, basically.

last updated: july 2012

Alternatively, there is an easier way to add an ask box to your FAQs since I wrote this in January 2011. This way is much simpler and easier.

Go to customize page.

Click the pages tab, then click add a page or edit your existing FAQ page.

Click the HTML button where all the markup buttons are. (ie. bold, italic, strikeout)

Copy and paste the code below where you like in the window that opens when you clicked the HTML button.

Change the bolded (URL) part of the url in the code with your owl url.
eg.
http://www.tumblr.com/ask_form/URL.tumblr.com into
http://www.tumblr.com/ask_form/a-pocketful.tumblr.com

Before you press update, retype all the quotation marks and apostrophes in the code. There is a total of 16 quotation marks ( “ ) and 2 apostrophes ( ‘ ).

Press ‘Update’ and the ask box should appear.

Press ‘Save page’ and you’re done.

<p><iframe frameborder=”0” scrolling=”no” width=”100%” height=”149” src=”http://www.tumblr.com/ask_form/URL.tumblr.com” style=”background-color:transparent; overflow:hidden;” id=”ask_form“></iframe><!—[if IE]><script type=”text/javascript”>document.getElementById(‘ask_form’).allowTransparency=true;</script><![endif]—></p>

PLEASE MAKE SURE YOU CHANGE THE LINK IN THE CODE TO YOUR OWN URL! Just to make sure it works, send a little test message to yourself using your new ask box and if you don’t get it, then look back and make sure everything is right.

Whenever you change your url, you’ll need to edit your page and update the url in the code.

If this code doesn’t work then MAKE SURE that you retype all the quotation marks (“) and apostrophes (‘) in the code.

You need to have your ask box enabled in order for this to work.

Standard Layout, not Custom Layout.

I answer all questions about this privately on a daily basis, unless you’re anon (try not to be because sometimes the problems are different and i look at your blog to see whats wrong. if you are anonymous than it’s harder to help.)

And please try to be SPECIFIC about what’s wrong if you need help. “hi i tried adding an ask box to my page but it didn’t work help plz?¿?¿?” isn’t really enough…

FOR PICTURES + INSTRUCTIONS IF YOU NEED HELP, GO HERE!

8 months ago - (3724)

via gyapo ,org. dongwoon
#resources
#misc: theme recs

— Tumblr Theme Maker Masterpost

charmings:

I’m annoyed and tired of seeing people reposting my tumblr theme maker listography on tumblr and claiming it as their own, so I’m just going to post in on my own tumblr just for the sake of it.

the plain white hipster themes

1000scientists

30dialogues

arreter

distances

evanthe

fiebre

forenkladthemes

jbam-themes

mycoldsummer

pauserepeat

pouretrebelle

rawmoans/phrenesis

sleepingthemes

themesbyher

venoms

zishou

the anime themes (transition effects, pixel small fonts, hover effects)

aerou

elyxir

espeon

ettudis

evaeon

gyapo

hankai

harlequinthemes

incavothemes

ixora

kamikukisama

manatopia

starious

zious

the big fandom themes

confunded

duckponds

everthemes

hbks

hollyandthesunshine

labryinthines

lmthemes

maraudersthemes

quinni

sonicwand

stupidbloodyidiots

the themes idk what to categorize as

heartgrenadethemes

inspiredyelle

itsirk

kimchithemes

meinparfumthemes

pouliche

simplynorule

sweet-themes

useyoureyes

vanilla-chai

villainz

If you know of any more tumblr theme makers, feel free to leave an ask and I’ll update it.

(Source: dongwoon)

8 months ago - (2783)

via zuvia ,org. zuvia
#tutorial
#music player

zuvia:

Music Player with Playlist!

Live preview

How to Install:

Copy THIS CODE (the CSS)

Paste it before “</style>” (Use CTRL+F to find it)

Then copy THIS CODE (the BODY)

Paste it after “<body>”

Useful Links:

How to upload mp3 files

Html/CSS Editing

To add music, paste your code from Billyplayer right after the line that says

<!— YOUR MUSIC CODE GOES HERE, RIGHT AFTER THIS LINE. —>

It’s found in the BODY code. There are further instructions in the code - just follow them and you should be alright.

You can also move the player around on your theme. To do so, find “#editthis{” in the CSS, and change the “top” and “left” value numbers.

9 months ago - (192)

via shinkos-deactivated20121103 ,org. shinkos-deactivated20121103
#misc: themes

shinkos:

Nihonjin (theme 4)

Preview and code

My first grid theme with infinite scrolling and, IT WORKS!! Thank you so much fukuo for your help :) It was too difficult to make the infinite scrolling work right so i didn’t want to make pagination, hope you like it.

Also, the image of the corner is not included on the code, and there are 4 custom links that appear when hovering over the sidebar image.

9 months ago - (179)

via zojoh ,org. zojoh
#page: bias

zojoh:

BIAS PAGE

PREVIEW | CODE

HOVER EFFECT CREDIT: Codrops

HOW TO ADD THIS

Go customize your blog

Scroll to the bottom and click “pages”

Then click “+ add a page”

Then instead of “Standard layout” pick “Custom Layout”

As always chose your URL

Copy the code and paste it in the .. box..

Create the page, save and then DONE ~

I’ve made /* */ info in the code, so it’s hopefully easy to tweak, to your liking. But if you want a bit more help then;

Look for this in the <body> section

THE HEADER

<div id=”title”> TITLE HERE </div>
<div id=”navi”>
<a href=”/”>back</a> -
<a href=”/ask”>message</a> -
<a href=”http://zojoh.tumblr.com”>credit</a> ~~dont even dare to touch that lol~~
</div>

THE TEXT UNDER THE HEADER

<div id=”my”> hover pictures / hover title for navigation<br/> other text can be added</div>

THE PICTURES

<!—- COPY THIS AS MANY TIMES AS YOU WANT—->

<div class=”view view-first”>
<img style=”width:300px” src=” PICTURE URL HERE ” />
<div class=”mask”>
<h2>PICTURE TITLE / NAME</h2>
<p>DESCRIPTION HERE</p>
<a href=” IF YOU HAVE A TAG OR OTHER THINGS ON YOUR BLOG THEN PUT URL HERE” class=”info”>More</a>
</div> /* if not ‘more’ then delete from < href=”“> to </a> */
</div>
<!—- COPY THIS AS MANY TIMES AS YOU WANT —->

Hope you’ll enjoy!

9 months ago - (65)

via zojoh ,org. zojoh
#misc: themes

zojoh:

#7 Europium

V1: Preview, Code & Features | V2: Preview, Code & Features

The differences are minor details! like pagination is moved in V2. But the whole point of V2 is that i wanted to show a colorful version of this theme. I’m sorry, i’m not so good with color combos XD

They have the same features, i just enabled different things on each version.

I hope you like it! it took me a long time, because i constantly screwed a thing up!

Inspirations for this theme : -apple & nunmuri

Hope you all like it! I would love feedback/like/reblog if you use it, no presure tho n_n. If you find any bugs, problems etc. leave it in my askbox thank you ~!

9 months ago - (61)

via mogimochi ,org. mogimochi
#page: redirect

mogimochi:

REDIRECT THEME 01 by MOGIMOCHI

LIVE PREVIEW | VIEW CODE

If you’d like the code for the interactive fish background, please ask me for it. (It’s made by aBowman)

Read more for instructions on how to use/edit this redirect theme! (PLEASE READ IF YOU ARE USING IT!)

Please like/reblog if you’re using the theme!

Read More

9 months ago - (439)

via ettudis ,org. ettudis
#tutorial
#how to: theme

— 3D Glasses Text CSS Tutorial

ettudis:

Today, we’re going to be looking at how to create the 3D glasses text effect with only CSS. A familiarity with CSS is required but it is a very easy concept to grasp. For a clearer example, please take a look my monologue theme for a live preview of the effect. (Also, click on images for larger view)

So basically, the 3D Glasses effect is just using 2 text-shadow properties placed in different positions to achieve the tri-coloured look. Having one text-shadow property can make a text look like the following:

The text will be put as a heading in the HTML:

<h1>ettudis</h1>

The CSS is:

h1 {
text-shadow: 2px 0 .2px #FF0000;
color:#000;
font:25px lucida sans,arial,sans-serif;
}

The 2px explains the positioning in the horizontal plane (positive is to the right, negative is to the left). The 0 explains the positioning in the vertical plane (negative is upward, positive is downward) and the .2px explains the extent of blur and of course, #FF0000 is the hex colour of the shadow.

For example, a blue text-shadow going ONLY to the left will look like the following (note the negative sign):

The CSS:

h1 {
text-shadow: -2px 0 .2px #00F1F5;
color:#000;
font:25px lucida sans,arial,sans-serif;
}

Now we put two of those text-shadow properties together, one going to the right (red) and one going to the left (blue).

h1 {
text-shadow: 2px 0 .2px #FF0000, -2px 0 .2px #00F1F5;
color:#000;
font:25px lucida sans,arial,sans-serif;
}

Notice, I’ve added a comma, followed by the second text-shadow properties, and ta-da! That’s how you get a 3D Glasses effect for your text using CSS.

9 months ago - (364)

via gyapo ,org. gyapo
#tutorial
#sidebar
#how to: theme

gyapo:

Tutorial : “Bubblebar”

You will have to adjust the height/width of the bubbles on hover depending on the lenght of your text

Music Player Recommended : Billy player.

Icons found at ixora. Credits/likes/reblogs appreciated.

Put this part in the CSS, above the tag </style>

#bubblebar
{font-family:lucida console;
width:60px;
position:fixed;
right:15px;
bottom:70px;
z-index:999;
font-size:9px;
text-align:center;}

.bubble
{text-align:center;
color:#555;
float:right;
height:10px;
width:34px;
padding-top:12px;
padding-bottom:12px;
margin-top:10px;
overflow:hidden;
-moz-border-radius: 17px 17px 17px 17px;
border-radius:17px 17px 17px 17px; 
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;}
.bubble img
{margin-bottom:10px;
margin-top:-2px;}

#vertical
{position:fixed;
width:10px;
right:30px;
bottom:0px;
height:260px;
background-image:url('http://25.media.tumblr.com/tumblr_ly0ae2N4hE1r9g6hvo6_r1_1280.png');
background-color:#f8c76f;
-moz-border-radius: 10px 10px 0px 0px;
border-radius:10px 10px 0px 0px; }

#bubble1 {border:3px solid #9ec1f2;
background-color:#fff} 
#bubble1:hover
{padding:5px;
height:50px;
width:120px;
border:3px solid #4680d2;}

#bubble2
{border:3px solid #f795bc;
background-color:#fff;} 
#bubble2:hover
{padding:5px;
height:50px;
width:120px;
border:3px solid #be2a65;}

#music
{border:3px solid #acacac;
background-color:#fff;
padding:14px 0px 10px 0px;} 
#music:hover
{padding:5px;
height:50px;
width:50px;
border:3px solid #111;}
#bubbleplayer{padding:2px 0px 5px 0px;}

Put this part above the tag </body>.

<div id='vertical'></div>
<div id='bubblebar'>
<div class='bubble' id='bubble1'><img src="http://media.tumblr.com/tumblr_lkl6900eU61qfamg6.gif"/>
<div>bubble 1 text here</div>
</div><!--bubble1-->
 
<div class='bubble' id='bubble2'><img src="http://i11.photobucket.com/albums/a168/evelynregly/minigifs/minicaderno2.gif"/>
<div>bubble 2 text here</div>    
</div><!--bubble2-->
 
<div class='bubble' id='music'><img src="http://static.tumblr.com/rltvkjt/jwflmr3vh/marcadores71.gif"/>
<div id='bubbleplayer'>MUSIC PLAYER CODE</div>
</div><!--music bubble-->
</div><!--bubbleblar-->

9 months ago - (523)

via fukuo ,org. shinkos-deactivated20121103
#tutorial
#music player

$fukuo: shinkos: Live Preview. Hope you like it. Credits: Icon: IxoraMusic Player: Billy Code: Copy and Paste this in the CSS part, above </style> #square{ position:fixed; top:10px; left:10px; width:30px; height:30px; line-height:10px; overflow:hidden; background-color:#ffffff; box-shadow: 2px 3px 10px 0px #777777; } #gif{ height:30px; width:60px; margin-left:-30px; -webkit-transition: all .7s ease-in-out; -moz-transition: all .7s ease-in-out; -o-transition: all .7s ease-in-out; -ms-transition: all .7s ease-in-out; transition: all .7s ease-in-out; } #gif:hover{ margin-left:2px; -webkit-transition: all .7s ease-in-out; -moz-transition: all .7s ease-in-out; -o-transition: all .7s ease-in-out; -ms-transition: all .7s ease-in-out; transition: all .7s ease-in-out; } #player{ height:30px; padding:5px; width:13px; margin-left:2px; overflow:hidden; position:absolute; } Now, below the tag <body> paste this code, maybe you’ll have to retype all the quotations marks so don’t forget to do it. <div id=”square”> <div id=”gif”> <div id=”player”> <embed style=”margin-left:-24px;” src=MUSIC CODE HERE</div> <img style=”margin-left:38px;margin-top:8px;”src=”http://media.tumblr.com/tumblr_lm6prnRzP61qfoi4t.gif”> </div> </div> On the MUSIC CODE, You have to delete this part of the beginning: <embed src= and then it will work fine. Click here to see a tutorial on how to retype the quotation marks.$

fukuo:

shinkos:

Live Preview. Hope you like it.

Credits:

Icon: Ixora
Music Player: Billy

Code:

Copy and Paste this in the CSS part, above </style>

#square{
position:fixed;
top:10px;
left:10px;
width:30px;
height:30px;
line-height:10px;
overflow:hidden;
background-color:#ffffff;
box-shadow: 2px 3px 10px 0px #777777;
}
#gif{
height:30px;
width:60px;
margin-left:-30px;
-webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
-ms-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
}
#gif:hover{
margin-left:2px;
-webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
-ms-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
}
#player{
height:30px;
padding:5px;
width:13px;
margin-left:2px;
overflow:hidden;
position:absolute;
}

Now, below the tag <body> paste this code, maybe you’ll have to retype all the quotations marks so don’t forget to do it.

<div id=”square”>
<div id=”gif”>
<div id=”player”>
<embed style=”margin-left:-24px;” src=MUSIC CODE HERE
</div>
<img style=”margin-left:38px;margin-top:8px;”src=”http://media.tumblr.com/tumblr_lm6prnRzP61qfoi4t.gif”>
</div>
</div>

On the MUSIC CODE, You have to delete this part of the beginning: <embed src= and then it will work fine.

Click here to see a tutorial on how to retype the quotation marks.