Pop Up Ask Box on Your Main Page
1. Copy and paste the code below right after <head> tags.
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://png.findicons.com/files/icons/1714/dropline_neu/24/dialog_close.png" class="btn_close" title="Close" alt="Close" /></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
**the highlighted is a image of “close” button. if you want change the image just replace with your url of image or you can choose here
2. Paste this code under <style type=”text/css”> tags
.popup_block{
display: none;
background: #D3D3D3;
background-image: url();
padding: 10px;
font-family: Garamond;
float: left;
font-size: 10px;
position: fixed;
top: 50%; left: 50%;
z-index: 2;
border: 2px solid #363636;
-moz-box-shadow: 0 0 5px #CFCFCF;
-webkit-box-shadow: 0 0 5px #CFCFCF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
img.btn_close {
float: right;
margin: -5px -5px 0 0;
}
*html .popup_block {
position: absolute;
}
** if you want to customize your ask box, just change what you want, i already highlight the tags of color. you can insert image background if you like, just put the url between (url)
3. paste this code after </body> tags.
<div id="02" class="popup_block"> <Center><font size="5" color="#1C1C1C">Ask Me Anything<p></font><iframe frameborder="0" scrolling="yes" width="100%" height="150" src="http://www.tumblr.com/ask_form/USERNAME.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"> </center></div> </div></div></div></div></div></div></div></div></div></div>
** make sure you replace the USERNAME wit your username!
4. Change the code of your “ask” link to this code.
<a href="#?w=500" rel="02" class="poplight">ask me</a>
** change the “ask me” to title of your ask link
CHECK THIS FOR EXTRA EXPLANATION WITH STEP 4
PLEASE FOLLOW THE INSTRUCTION CAREFULLY. FEEL FREE TO ASK ME IF YOU HAVE PROBLEM WITH IT.
Enable Ask Box (for new dashboard)
UPDATE : 03 OCT 2012 
1. In your Dashboard, select your blog title
2. Click “Settings” at the sidebar
3. Find the “Ask” option and mark the box if you want to enable your ask box / allow anonymous, you can change the ask page title.
Ask Box in your description / sidebar
1. copy this code
<iframe frameborder="0" border="0" scrolling="no" width="300” height="190" allowtransparency="true" src="http://www.tumblr.com/ask_form/USERNAME.tumblr.com" style="background-color:transparent; overflow:hidden;"></iframe>
2. paste this code in your description, you can change the width and the height. Don’t forget to replace USERNAME with your Tumblr username, example: academyoftumblr.tumblr.com
