Anya is live and ready to show you everything. Watch her strip, dance, and perform exclusive shows just for you. Interact in real-time and make your fantasies come true.
✓ Live Streaming✓ Interactive Chat✓ Private Shows✓ HD Quality✓ Free Actions
Free to watch • No registration required • HD streaming
I’ve just done a big update on all my themes. If anyone using one of my themes finds that something is broken, just go back to pastebin for the updated code.
This update includes fixing the ever-favourite Steampunk Theme!
Before we start, let me say that I didn’t write the original javascript for this. I found it about 2.5 years ago and no amount of searching has brought me to the original creator who I would source if I could.
I will try to make this tutorial as easy as possible for people who don’t know much about HTML. The code for adding a popup askbox comes in four parts, which I will try to make as clear as possible.
STEP 1: Find in your theme’s code the 'ask' link. It should look like this:
What this does is when you click your 'ask' link, instead of being sent to a new page you will trigger a javascript function. For now it will appear to do nothing.
STEP 2: Next we add the javascript function.
Start by finding these two tags in your theme's code: "</style>" and "</head>".
Next copy what's below into a space between these two tags:
<script type="text/javascript"> function open(askbox) { var askcontainer = document.getElementById(askbox); if (askcontainer) {askcontainer.className=(askcontainer.className=='closed')?'open':'closed';} } </script>
This tells your browser what to do when the 'ask' link is clicked. But like before, you won't see anything happen yet.
STEP 3: Now to add the askbox itself. This can go anywhere in the body section, but if you don't know what you're doing, just find <body> and the code can be pasted immediately after it.
This is the code to copy and paste. I will give a breakdown immediately after.
The javascript from step 2 finds this <div> with the id "askbox" and will open or close it. We start with it "closed" so it remains closed until we click the "ask" link.
The second line in this code will (with the CSS below) give you a semi-transparent black background. The link means you can click anywhere on the background and it will close the popup. It does this by activating the exact same javascript as before, and the javascript just switches between open and closed.
The third line is a box containing your popup itself. If you know CSS you can make this look like anything you want.
The fourth is the title above your askbox. You can change {AskLabel} into anything you want your heading to say.
The fifth line, "<iframe...", is the askform itself. IMPORTANT: YOU MUST CHANGE USERNAME.TUMBLR.COM TO YOUR OWN URL OR IT WILL NOT WORK.
As a bonus, you can add an FAQ on a new line immediately before or after "<iframe..." like so: <p>FAQ here</p>
If you were to update your theme preview now, your askbox would appear at the top of your page and would make your theme look a mess. The final step will fix this.
STEP 4: Our last step is to style the popup. The code below will give you only a basic black and white style. People who know a bit of CSS may change it however they want.
The following needs to be pasted someplace between the "style" tags. If you're not sure where, find the "</style>" tag and paste the following immediately before it:
#askbox - This is the thing that will open and close. It will appear as the semi-transparent black background behind the popup. You can change the background-color, but it is best not to change anything else here.
#askbox.open, #askbox.closed - This is what makes the magic happen. Don't change this or your popup won't work.
#askboxbg - This is what makes it possible to click on the background and close the popup. Do not change any of the code here.
#askbox #ask - This is a the white popup itself. You can edit any of the code here except for the z-index.
Now if you click on your "ask" link the popup will work. Click on the background and it will close again. Well done, you've installed a popup askbox!
Doesn't work?
Nothing happens when I click my "ask" link? - Sometimes other javascript on your blog can break the popup code. If you have a music player, shimejis, falling snow, or anything similar, that can affect your popup askbox. If you remove those and your popup works, they were the problem. You have to choose between one or the other.
The popup comes up fine, but my askbox isn't there/is broken? - First check that when you did step three, you changed "username.tumblr.com" to your own url. If you have done this and your askbox still isn't working, check for typos, and also check that in your blog settings (tumblr.com/settings/blog/yourusername) you have enabled asks.
I was playing around with the code and now it's all broken? - You probably deleted something vital by accident. Return to the default code from this tutorial and try again.
It works on my blog but not on my customise page? - Tumblr is dumb sometimes. So long as it works for people visiting your blog it's fine.
I followed your tutorial perfectly and tried everything you said above and it's still not working! - That happens sometimes. Send me an ask and I will see what I can do.
Can I do the same for my submit form? - Yes. You can do it by duplicating everything here and replacing every single use of the word 'ask' with 'submit' (including askbox→submitbox, etc). Then replace the entire "<iframe...>" with the following code. REMEMBER TO CHANGE "USERNAME.TUMBLR.COM" WITH YOUR OWN URL.
Just a small point of interest, my 'likes' page is full of themes I adore and other tips and tidbits. If you're into the kind of themes I make and want to see more by other theme makers, I suggest you browse through the page linked.
(On a side-note, Star Trek and Christmas themes are on their way!)
Anya is live and ready to show you everything. Watch her strip, dance, and perform exclusive shows just for you. Interact in real-time and make your fantasies come true.
✓ Live Streaming✓ Interactive Chat✓ Private Shows✓ HD Quality✓ Free Actions
Free to watch • No registration required • HD streaming
So I'm a huge perfectionist when it comes to my blog banners ever since tumblr made it a feature. I even made myself a photoshop-file template to arrange things nicely and crop and adjust colours before uploading it to tumblr.
Now I'm making it available to my followers. Now it is a photoshop file, made in CS4 compatibility mode so unfortunately only some of you will be able to use it. The download for it is here. It comes with organised layers and guidelines to help you out if you're a perfectionist like me.
For those who can't use the file, I'm going to give you a rundown here.
Banners
Your uploaded banner should be at least 625x353px. For HD use1250x706px. Use jpgs for fast loading times.
When displayed on the side of the dashboard your banner will appear slightly smaller but the dimension ratio will stay the same. You don't have to worry about anything being cropped out.
Do not round the corners of your banner (as shown in the preview). Tumblr will do that automatically.
Icons
Uploaded icons should be at least 128x128px, but it displays in the preview as 96x96px.
Even if you choose to display your icon as circular on the settings page, you still need to upload a square image.
I don't care if my blog doesn't have a strict theme anymore. I'm just going to blog what I want and if you don't like it, sorry! Just gonna do ma thang
