Advertisement
gabyschank

FAQ Page Theme

Aug 26th, 2014
344
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.00 KB | None | 0 0
  1. <!--FAQ Page Theme by confers
  2. http://fluorescent-themes.tumblr.com/
  3. Please do not remove the credit---->
  4.  
  5. <html lang="en">
  6.  
  7. <head>
  8. <title>{Title}</title>
  9. <link rel="shortcut icon" href="{Favicon}"/>
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  12. <meta name="color:background" content="#ffffff" />
  13. <meta name="color:text" content="#000000" />
  14. <meta name="color:title" content="#000000" />
  15. <meta name="color:title hover" content="#000000" />
  16. <meta name="color:link" content="#000000" />
  17. <meta name="color:link hover" content="#000000" />
  18. <meta name="color:scrollbar" content="#000000" />
  19.  
  20. <meta name="text:link 1 title" content="" />
  21. <meta name="text:link 1" content="" />
  22. <meta name="text:link 2 title" content="" />
  23. <meta name="text:link 2" content="" />
  24. <meta name="text:link 3 title" content="" />
  25. <meta name="text:link 3" content="" />
  26. <meta name="text:link 4 title" content="" />
  27. <meta name="text:link 4" content="" />
  28. <meta name="text:link 5 title" content="" />
  29. <meta name="text:link 5" content="" />
  30.  
  31. <meta name="image:Left Background" content""/>
  32. <meta name="image:Right Background" content""/>
  33. <meta name="image:Cover Background" content""/>
  34. <meta name="image:Sidebar" content""/>
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Cedarville+Cursive' rel='stylesheet' type='text/css'>
  37.  
  38. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  39.  
  40. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  41. <script>
  42. (function($){
  43. $(document).ready(function(){
  44. $("[title]").style_my_tooltips({
  45. tip_follows_cursor:true,
  46. tip_delay_time:200,
  47. tip_fade_speed:300
  48. }
  49. );
  50. });
  51. })(jQuery);
  52. </script>
  53.  
  54. {block:IndexPage}
  55.  
  56. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  57. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  58.  
  59. <script type="text/javascript">
  60. $(window).load(function(){
  61. var $wall = $('#entries');
  62. $wall.imagesLoaded(function(){
  63. $wall.masonry({
  64. itemSelector: '#post, #post_photo',
  65. isAnimated : false
  66. });
  67. });
  68.  
  69. $wall.infinitescroll({
  70. navSelector : '#pagination',
  71. nextSelector : '#pagination a',
  72. itemSelector : '#post, #post_photo',
  73. bufferPx : 2000,
  74. debug : false,
  75. errorCallback: function() {
  76. $('#scroll').fadeOut('normal');
  77. }},
  78. function( newElements ) {
  79. var $newElems = $( newElements );
  80. $newElems.hide();
  81. $newElems.imagesLoaded(function(){
  82. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  83. });
  84. }); $('#entries').show(500);
  85. });
  86. </script>
  87. {/block:IndexPage}
  88. <style type="text/css">
  89.  
  90. #s-m-t-tooltip{
  91. max-width:300px;
  92. margin:15px;
  93. padding:2px 8px;
  94. border:1px solid #ccc;
  95. border-radius:4px;
  96. background:#FFF;
  97. z-index:999999;
  98. letter-spacing:1px;
  99. font-size:9px;
  100. text-transform:uppercase;
  101. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  102.  
  103. body{
  104. color:#000;
  105. font-family:consolas;
  106. font-size:10px;
  107. }
  108.  
  109. ::selection {
  110. background:#ccc;
  111. color:#fff;
  112. }
  113. ::-moz-selection {
  114. background:#ccc;
  115. color:#fff;
  116. }
  117.  
  118. ::-webkit-scrollbar{
  119. width:8px;
  120. height:8px;
  121. background:#fff;}
  122.  
  123. ::-webkit-scrollbar-thumb{
  124. background:#000;
  125. height:5px;
  126. border:#fff solid 3px;}
  127.  
  128. a:link, a:active, a:visited{
  129. -webkit-transition: 0.3s ease;
  130. transition: 0.3s ease;
  131. -o-transition: 0.3s ease;
  132. -moz-transition: 0.3s ease;
  133. color:#000;
  134. text-decoration:none;
  135. }
  136.  
  137. a:hover{
  138. -webkit-transition: 0.3s ease;
  139. transition: 0.3s ease;
  140. -o-transition: 0.3s ease;
  141. -moz-transition: 0.3s ease;
  142. color:#45966e;
  143. }
  144.  
  145.  
  146.  
  147. #sidebar{
  148. border:1px solid #ccc;
  149. margin-top:200px;
  150. text-align:center;
  151. background:transparent;
  152. width:900px;
  153. border-radius:3px;
  154. height:230px;
  155. }
  156.  
  157. #askbox{
  158. margin-left:410px;
  159. margin-top:10px;
  160. }
  161.  
  162. #desc{
  163. overflow-y:scroll;
  164. padding:2px;
  165. border:1px solid #ccc;
  166. width:403px;
  167. margin-left:13px;
  168. border-radius:3px;
  169. height:198px;
  170. position:absolute;
  171. margin-top:8px;
  172. }
  173.  
  174. .title{
  175. position:absolute;
  176. margin-top:-40px;
  177. text-align:center;
  178. font-family: 'Cedarville Cursive', cursive;
  179. font-size:22px;}
  180.  
  181. .title a{
  182. -webkit-transition: 0.3s ease;
  183. transition: 0.3s ease;
  184. -o-transition: 0.3s ease;
  185. -moz-transition: 0.3s ease;
  186. color:{color:title};
  187. }
  188.  
  189. .title a:hover{
  190. -webkit-transition: 0.3s ease;
  191. transition: 0.3s ease;
  192. -o-transition: 0.3s ease;
  193. -moz-transition: 0.3s ease;
  194. color:{color:title hover};
  195. }
  196.  
  197. .links{
  198. text-align:right;
  199. padding-right:15px;
  200. margin-top:-5px;
  201. text-transform:uppercase;
  202. font-family:consolas;
  203. font-size:9px;
  204. letter-spacing:1px;}
  205.  
  206. .links a{
  207. padding:5px;
  208. background:#e1e1e1;
  209. }
  210.  
  211. #credit {
  212. position:fixed;
  213. font-family:consolas;
  214. font-size:10px;
  215. bottom:10px;
  216. z-index:999999999999;
  217. right:10px;
  218. text-transform:uppercase;
  219. }
  220.  
  221. #q{
  222. line-height:20px;
  223. font-family: 'Cedarville Cursive', cursive;
  224. color:#45966e;
  225. text-transform:lowercase;
  226. font-size:16px;
  227. text-align:left;
  228. }
  229.  
  230. #a{
  231. background:#e1e1e1;
  232. text-align:left;
  233. text-transform:uppercase;
  234. font-size:9px;
  235. letter-spacing:1px;
  236. padding:4px;
  237. }
  238.  
  239. #extra{
  240. border:1px solid #ccc;
  241. padding:10px;
  242. width:350px;
  243. text-transform:uppercase;
  244. font-size:9px;
  245. margin-left:20px;
  246. border-radius:0px 0px 3px 3px;
  247. text-align:left;
  248. position:absolute;
  249. margin-top:2px;
  250. }
  251.  
  252. </style>
  253.  
  254. </head>
  255. <body>
  256. <center>
  257. <div id="sidebar">
  258. <div class="title">Frequently Asked Questions</div>
  259. <div class="links">
  260. <a href="/">go back</a>
  261.  
  262. <!---- these are your links, erase/add extra if you need to ---->
  263.  
  264. <a href="LINK URL">LINK NAME</a>
  265. <a href="LINK URL">LINK NAME</a>
  266. <a href="LINK URL">LINK NAME</a>
  267. <a href="LINK URL">LINK NAME</a>
  268. <a href="LINK URL">LINK NAME</a>
  269. </div>
  270. <div id="desc">
  271.  
  272. <!---- this is the actual faq part. erase/add extra if you need to ---->
  273. <div id="q"> Question? </div>
  274. <div id="a"> answer </div>
  275.  
  276. <div id="q"> Question? </div>
  277. <div id="a"> answer </div>
  278.  
  279. <div id="q"> Question? </div>
  280. <div id="a"> answer </div>
  281.  
  282. <div id="q"> Question? </div>
  283. <div id="a"> answer </div>
  284.  
  285. <div id="q"> Question? </div>
  286. <div id="a"> answer </div>
  287.  
  288. <div id="q"> Question? </div>
  289. <div id="a"> answer </div>
  290.  
  291. <div id="q"> Question? </div>
  292. <div id="a"> answer </div>
  293.  
  294.  
  295. </div>
  296.  
  297. <!---- this is your ask box, make sure you change the url to your url or else it won't work ---->
  298. <div id="askbox">
  299. <p>&nbsp;<iframe frameborder="" height="200" id="ask_form" src="http://www.tumblr.com/ask_form/YOUR-URL.tumblr.com" width="450px"></iframe></p></div>
  300.  
  301. <!----Put anything else you want to say here! If you don't have anything else to say just erase it---->
  302.  
  303. <div id="extra">Other comments</div>
  304.  
  305.  
  306. </div>
  307.  
  308.  
  309.  
  310. </div>
  311. <div id="credit"><a href="http://fluorescent-themes.tumblr.com">credit</a></div>
  312. </div>
  313. </body>
  314. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement