API tools faq
paste
Advertisement
themesbygeorgia

Page 08 -- All In One

themesbygeorgia
Aug 5th, 2014
896
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.87 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5. <!--- All In One Theme #1 by wonderfullythemes
  6.  
  7. Includes: FAQ + Ask, About, Tags and Blogroll. I've included all relevant comments, but if you're stuck with something then send me an ask!
  8.  
  9. Rules about the credit: I have two links on this theme, you can choose to keep both (if you decide this ily) or remove ONE. Not both ok, either the bottom corner OR the one among the links. Thanks c:
  10.  
  11. --->
  12.  
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. <!--SCRIPT FOR TOOLTIPS-->
  18. <stsss>
  19. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  20. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  21. <script>
  22. (function($){
  23. $(document).ready(function(){
  24. $("a[title]").style_my_tooltips({
  25. tip_follows_cursor:true,
  26. tip_delay_time:50,
  27. tip_fade_speed:100,
  28. attribute:"title"
  29. });
  30. });
  31. })(jQuery);
  32. </script>
  33.  
  34. <!--SCRIPT FOR THE CAROUSEL - FROM STR-WR'S TUTORIAL-->
  35. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  36. <script type="text/javascript" src="http://static.tumblr.com/lv6casp/aCNm74ixy/stepcarousel.js">
  37. /***********************************************
  38. * Step Carousel Viewer script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
  39. * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
  40. * This notice must stay intact for legal use
  41. ***********************************************/
  42. </script>
  43.  
  44. <script type="text/javascript">
  45. stepcarousel.setup({
  46. galleryid: 'mygallery', //id of carousel DIV
  47. beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
  48. panelclass: 'panel', //class of panel DIVs each holding content
  49. autostep: {enable:false, moveby:1, pause:3000},
  50. panelbehavior: {speed:500, wraparound:false, wrapbehavior:'slide', persist:true},
  51. defaultbuttons: {disable: true, moveby: 1, leftnav: ['', -40, 120], rightnav: ['', 10, 120]},
  52. statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
  53. contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
  54. })
  55. </script>
  56.  
  57. <style type="text/css">
  58.  
  59. /*----------------------BASICS------------------------*/
  60.  
  61. ::-webkit-scrollbar-thumb {
  62. height:auto;
  63. background-color:#444; /*--change the scrollbar colour--*/
  64. }
  65.  
  66. ::-webkit-scrollbar {
  67. height:4px;
  68. width:7px;
  69. padding-right:2px;
  70. background-color:#fff; /*--change the scrollbar background colour--*/
  71. }
  72.  
  73. #s-m-t-tooltip {
  74. max-width:200px;
  75. font-family:'consolas';
  76. font-size:9px;
  77. background-color:#444; /*--change the tooltip background colour--*/
  78. color:#ddd; /*--change the tooltip text colour--*/
  79. border:1px solid #ddd; /*--change the tooltip border colour--*/
  80. box-shadow:2px 2px 2px #ddd; /*--change the tooltip shadow colour--*/
  81. line-height:100%;
  82. display:none;
  83. position:absolute;
  84. letter-spacing:1px;
  85. text-transform:uppercase;
  86. padding:5px;
  87. margin:15px 0px 0px 15px;
  88. z-index:99999999999999;
  89. }
  90.  
  91. body {
  92. background:#fff; /*--change the main background colour--*/
  93. color:#444; /*--change the default text colour--*/
  94. font-family:'calibri'; /*--change the default font--*/
  95. font-size:10px; /*--change the default font size-*/
  96. text-decoration:none;
  97. text-transform:none;
  98. margin:0px;
  99. }
  100.  
  101. a {
  102. color:#56bc8a; /*--change the default link colour--*/
  103. text-decoration:none;
  104. -moz-transition-duration:0.7s;
  105. -webkit-transition-duration:0.7s;
  106. -o-transition-duration:0.7s;
  107. }
  108.  
  109. a:hover {
  110. color:#ddd; /*--change the default link hover colour--*/
  111. -moz-transition-duration:0.7s;
  112. -webkit-transition-duration:0.7s;
  113. -o-transition-duration:0.7s;
  114. }
  115.  
  116. /*-----------BOX WITH ALL THE STUFF-----------*/
  117.  
  118. #container {
  119. width:520px;
  120. height:130px;
  121. position:fixed;
  122. float:center;
  123. margin-left:27%;
  124. margin-top:15%;
  125. padding:40px;
  126. border:1px solid #ddd; /*--change the border colour--*/
  127. box-shadow:5px 5px 5px #ddd; /*--change the shadow colour--*/
  128. }
  129.  
  130. .text {
  131. background-color:#fff; /*--change the text background colour--*/
  132. color:#444; /*--change the text colour--*/
  133. width:380px;
  134. height:124px;
  135. position:absolute;
  136. overflow:hidden;
  137. }
  138.  
  139. .katie img {
  140. width:125px;
  141. height:125px;
  142. margin-left:380px;
  143. position:relative;
  144. }
  145.  
  146. #navlinks {
  147. width:auto;
  148. height:30px;
  149. line-height:100%;
  150. font-size:8px; /*--change the navigation links font size--*/
  151. text-transform:uppercase;
  152. position:absolute;
  153. margin-top:-7.5%;
  154. right:5%;
  155. }
  156.  
  157. #navlinks a {
  158. margin-right:5px;
  159. padding:3px;
  160. letter-spacing:1px;
  161. color:#56bc8a; /*--change the navigation links colour--*/
  162. background-color:#fff; /*--change the navigation links background colour--*/
  163. border:1px solid #ddd; /*--change the navigation links border colour--*/
  164. }
  165.  
  166. #navlinks a:hover {
  167. letter-spacing:3px;
  168. color:#ddd; /*--change the navi links hover colour--*/
  169. background-color:#444; /*--change the navi links background hover colour--*/
  170. border:1px solid #56bc8a; /*--change the navi links border hover colour--*/
  171. }
  172.  
  173. /*------------------------------CAROUSEL------------------------*/
  174. .stepcarousel{
  175. position:relative;
  176. background:#fff; /*--change the carousel background colour--*/
  177. width:380px;
  178. height:124px;
  179. }
  180.  
  181. .stepcarousel .belt{
  182. position:absolute;
  183. left:0px;
  184. top:0px;
  185. }
  186.  
  187. .stepcarousel .panel{
  188. float:left;
  189. overflow:hidden;
  190. margin:0px;
  191. width:380px;
  192. color:#444; /*--change the carousel text colour--*/
  193. }
  194.  
  195. #mygallery-paginate img {
  196. margin-top:10px;
  197. width:15px;
  198. height:15px;
  199. }
  200.  
  201. #container:hover .title {
  202. opacity:1;
  203. -moz-transition-duration:0.7s;
  204. -webkit-transition-duration:0.7s;
  205. -o-transition-duration:0.7s;
  206. }
  207.  
  208. .title {
  209. width:100%;
  210. float:center;
  211. text-align:center;
  212. margin-top:7px;
  213. opacity:1;
  214. -moz-transition-duration:0.7s;
  215. -webkit-transition-duration:0.7s;
  216. -o-transition-duration:0.7s;
  217. }
  218.  
  219. .title a {
  220. margin-right:5px;
  221. width:auto;
  222. font-size:8px;
  223. text-transform:uppercase;
  224. padding:3px;
  225. border:1px solid green;
  226. letter-spacing:1px;
  227. }
  228.  
  229. .title a:hover {
  230. color:#56bc8a; /*--keeps the "message/about etc" signs the same colour on hover--*/
  231. }
  232.  
  233. /*--FAQ TAB--*/
  234.  
  235. #faq {
  236. margin:0;
  237. width:380px;
  238. height:124px;
  239. overflow-y:scroll;
  240. }
  241.  
  242. #faq ul {
  243. text-transform:uppercase;
  244. background-color:#ddd; /*--change the 'title' background colour for the FAQ tab--*/
  245. color:#fff; /*--change the 'title' text colour for the FAQ tab--*/
  246. padding:1px;
  247. margin:0;
  248. font-size:11px; /*--change the 'title' font size for the FAQ tab--*/
  249. }
  250.  
  251. #faq li {
  252. padding:10px;
  253. color:#444; /*--change the main text colour for the FAQ tab--*/
  254. list-style:none;
  255. text-align:left;
  256. text-transform:none;
  257. }
  258.  
  259. /*--ABOUT TAB--*/
  260.  
  261. #about {
  262. margin:0;
  263. width:380px;
  264. height:124px;
  265. overflow-y:scroll;
  266. }
  267.  
  268. #about ul {
  269. text-transform:uppercase;
  270. background-color:#ddd; /*--change the 'title' background colour for the About tab--*/
  271. color:#fff; /*--change the 'title' text colour for the About tab--*/
  272. padding:1px;
  273. margin:0;
  274. font-size:11px; /*--change the 'title' font size for the About tab--*/
  275. }
  276.  
  277. #about li {
  278. padding:0 10px 0 10px;
  279. color:#444; /*--change the main text colour for the About tab--*/
  280. list-style:square;
  281. text-align:left;
  282. text-transform:none;
  283. }
  284.  
  285. /*--TAGS TAB--*/
  286.  
  287. #tag {
  288. margin:0;
  289. width:380px;
  290. height:124px;
  291. overflow-y:scroll;
  292. }
  293.  
  294. #tagscontainer {
  295. display:table;
  296. float:center;
  297. width:100%;
  298. }
  299.  
  300. #tags {
  301. text-align:center;
  302. height:100px;
  303. width:100%;
  304. padding:0;
  305. margin:0;
  306. display:table-cell;
  307. }
  308.  
  309. #tags ul {
  310. text-transform:uppercase;
  311. background-color:#ddd; /*--change the 'title' background colour for the Tags tab--*/
  312. color:#fff; /*--change the 'title' text colour for the Tags tab--*/
  313. padding:1px;
  314. margin-top:0px;
  315. margin-bottom:10px;
  316. font-size:11px;
  317. }
  318.  
  319. #tags a {
  320. font-size:8px;
  321. text-transform:uppercase;
  322. line-height:10px;
  323. height:10px;
  324. width:70px;
  325. padding:5px;
  326. display:inline-block;
  327. margin-right:8px;
  328. margin-bottom:8px;
  329. background-color:#ddd; /*--change the colour of the tags background--*/
  330. text-align:center; /*-- can be changed to "left" "right" or "justify"--*/
  331. color:#56bc8a; /*--change the colour of the tags here--*/
  332. -moz-transition-duration:0.7s;
  333. -webkit-transition-duration:0.7s;
  334. -o-transition-duration:0.7s;
  335. }
  336.  
  337. #tags a:hover {
  338. color:#ddd; /*--change the colour of the tags on hover here--*/
  339. background-color:#444; /*--change the background colour of the tags on hover--*/
  340. letter-spacing:2px; /*--change how much the letters become more apart, if you want them the same then change to 0px --*/
  341. -moz-transition-duration:0.7s;
  342. -webkit-transition-duration:0.7s;
  343. -o-transition-duration:0.7s;
  344. }
  345.  
  346. /*--BLOGROLL--*/
  347.  
  348. #content {
  349. margin:0;
  350. padding:0;
  351. width:380px;
  352. height:124px;
  353. overflow-y:scroll;
  354. }
  355.  
  356. #content img {
  357. text-align:center;
  358. float:center;
  359. padding:10px;
  360. width: 30px;
  361. height:30px;
  362. margin-top:-10px;
  363. margin-left:0px;
  364. margin-bottom:20px;
  365. margin-right:7px;
  366. border: 1px solid #ddd; /*--change the image border colour--*/
  367. background-color: #ffffff; /*--change the image background colour--*/
  368. -webkit-filter: grayscale(100%); /*--controls the grayscale effect--*/
  369. -webkit-transition-duration: 0.8s;
  370. -moz-transition-duration: 0.8s;
  371. -o-transition-duration: 0.8s;
  372. -ms-transition-duration: 0.8s;
  373. z-index: 2px;
  374. }
  375.  
  376. #content img:hover {
  377. box-shadow:3px 3px 3px #ddd; /*--change image shadow properties--*/
  378. -webkit-filter: grayscale(0%); /*--controls the colour on hover--*/
  379. -webkit-transition-duration: 0.8s;
  380. -moz-transition-duration: 0.8s;
  381. -o-transition-duration: 0.8s;
  382. -ms-transition-duration: 0.8s;
  383. z-index: 2px;
  384. }
  385.  
  386. /*--CREDIT - do not delete this code unless you're keeping my credit with the navi links--*/
  387. #spectrum {
  388. bottom:9px;
  389. right:7px;
  390. font-size:8px;
  391. font-family:'calibri';
  392. letter-spacing:1px;
  393. text-transform:uppercase;
  394. position:fixed;
  395. }
  396.  
  397. {CustomCSS}</style></head><body>
  398.  
  399. <div id="container">
  400.  
  401. <div id="navlinks"> <!--add delete however many you like. please leave my credit alone unless you're keeping the bottom-right link thanks-->
  402. <a href="/">Return</a>
  403. <a href="/">Link 1</a>
  404. <a href="/">Link 2</a>
  405. <a href="http://wonderfullythemes.tumblr.com">Credit</a>
  406. </div>
  407.  
  408. <div class="text">
  409.  
  410. <div id="mygallery" class="stepcarousel">
  411. <div class="belt">
  412.  
  413. <div class="panel">
  414.  
  415. <div id="faq"> <!--FAQ TAB-->
  416. <ul>What is this?</ul>
  417. <li>This is my first All In One theme, it features an faq, about, tags and blogroll page. The links at the top can be edited and/or removed, same with the titles below. It was inspired by Yukoi's <a href="http://yukoki-th.tumblr.com/suikomu">Suikomu</a> page and Magnustheme's <a href="http://magnusthemes.tumblr.com/post/93084889035/faq-page-01-silk-live-preview-code">Silk</a> page :)</li>
  418.  
  419. <ul>How do you decorate the text?</ul>
  420. <li>
  421. <b>bold</b> <i>italic</i> <u>underline</u> <s>strikethrough</s> <a href="">link</a><br>
  422. new line<p>
  423. new paragraph
  424.  
  425. </li>
  426.  
  427. <ul>Where do I insert my URL for the ask box to work?</ul>
  428. <li>Either scroll down till you see 'YOUR URL HERE' or Ctrl + F 'YOUR URL HERE in the code :)</li>
  429.  
  430. <ul>How do I add another question/answer?</ul>
  431. <li>Questions are surrounded by < ul > and < /ul > in the code. Answers are surrounded by < li > and < /li ></li>
  432.  
  433. <iframe frameborder="0" height="260" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/wonderfullythemes.tumblr.com" width="100%"></iframe>
  434.  
  435. </div>
  436. </div>
  437.  
  438. <div class="panel">
  439.  
  440. <div id="about"> <!--ABOUT TAB-->
  441.  
  442. <ul>Fandoms</ul>
  443.  
  444. <li>Veronica Mars</li>
  445. <br>
  446. that's it every other show pales in comparison
  447.  
  448. <br><br>
  449.  
  450. except for maybe Merlin<p>
  451.  
  452. <ul>Stuff I Like</ul>
  453. <li><s>coding</s></li>
  454. <li>reading</li>
  455. <li>sleeping</li>
  456. <li>shopping</li>
  457. that's a lot of ing's oops
  458.  
  459. <p>
  460. basically write whatever here :)
  461.  
  462. </div>
  463. </div>
  464.  
  465. <div class="panel">
  466.  
  467. <div id="tag"> <!--TABS TAB-->
  468. <div id="tagscontainer">
  469. <div id="tags"><ul>title here</ul>
  470. <a href="">tag here</a>
  471. <a href="">tag here</a>
  472. <a href="">tag here</a>
  473. <a href="">tag here</a>
  474. <a href="">tag here</a>
  475. <a href="">tag here</a>
  476. <a href="">tag here</a>
  477. <a href="">tag here</a>
  478. <a href="">tag here</a>
  479. <a href="">tag here</a>
  480. <a href="">tag here</a>
  481. <a href="">tag here</a>
  482.  
  483.  
  484. </div>
  485. </div>
  486.  
  487.  
  488. <div id="tagscontainer">
  489. <div id="tags"><ul>title here</ul>
  490. <a href="">tag here</a>
  491. <a href="">tag here</a>
  492. <a href="">tag here</a>
  493. <a href="">tag here</a>
  494. <a href="">tag here</a>
  495. <a href="">tag here</a>
  496. <a href="">tag here</a>
  497. <a href="">tag here</a>
  498.  
  499. </div>
  500. </div>
  501.  
  502. <!--<div id="tagscontainer">
  503. <div id="tags"><ul>title here</ul>
  504. <a href="">tag here</a>
  505. <a href="">tag here</a>
  506. <a href="">tag here</a>
  507. <a href="">tag here</a>
  508. <a href="">tag here</a>
  509. <a href="">tag here</a>
  510. <a href="">tag here</a>
  511. <a href="">tag here</a>
  512.  
  513. </div>
  514. </div>-->
  515.  
  516.  
  517. </div>
  518. </div>
  519.  
  520. <div class="panel">
  521.  
  522. <div id="content"> <!--BLOGROLL-->
  523.  
  524. <p>
  525. {block:Following}{block:Followed}
  526. <a target="_blank" href="{FollowedURL}" title="{FollowedName}"><img src="{FollowedPortraitURL-64}"/>
  527. {/block:Followed}{/block:Following}</a>
  528. </p>
  529. </div>
  530.  
  531. </div>
  532. </div></div>
  533.  
  534.  
  535. </div>
  536.  
  537.  
  538. <!--INSERT YOUR IMAGE URL BELOW-->
  539. <div class="katie"><img src="http://static.tumblr.com/b8d4acdbb557c244fbf4baa4eea6b5bf/r8vffrc/YOon9sjtz/tumblr_static_52d5x9zvf84c40gsw48g0w88c.png"/></div>
  540.  
  541. <div align="center"><p id="mygallery-paginate" style="width:416px;margin:0px;">
  542.  
  543. <img src="http://sunsynchrony.com/technology/analysis/img/diamond_prof.png" data-over="http://wpcontent.answcdn.com/wikipedia/commons/thumb/2/22/Regular_polygon_4.svg/220px-Regular_polygon_4.svg.png" data-select="http://1.bp.blogspot.com/-2cR8maZ0JGk/UKbPumpcSQI/AAAAAAAAA1Y/tXhIkGcQ5Fw/s1600/Screen+Shot+2012-11-16+at+5.43.26+PM.png" data-moveby="1" /></p></div>
  544.  
  545. <div class="title"> <!--CHANGE TITLES LINKS HERE-->
  546.  
  547. <a>message</a>
  548. <a>about</a>
  549. <a>links</a>
  550. <a>blogroll</a>
  551.  
  552. </div>
  553.  
  554. </div>
  555.  
  556. <!--dont touch unless you're keeping the credit in the navi links thank you-->
  557. <div id="spectrum">
  558. <a href="http://wonderfullythemes.tumblr.com">theme</a>
  559. </div>
  560.  
  561. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!