API tools faq
paste
Advertisement
booksinvolved

tags page 01

booksinvolved
May 12th, 2014
628
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.29 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.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <head>
  6.  
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  10. <link href='http://fonts.googleapis.com/css?family=Fenix' rel='stylesheet' type='text/css'>
  11.  
  12. <link href='http://fonts.googleapis.com/css?family=Fondamento' rel='stylesheet' type='text/css'>
  13.  
  14.  
  15. <style type="text/css">
  16. @font-face { font-family: Market Deco; src: url('http://www.mediafont.com/storage/contents/11020/font.eot'); /* IE */ src: local('Market Deco'), url('http://www.mediafont.com/storage/contents/11020/Market_Deco.ttf'); /* non-IE */ }
  17.  
  18. @font-face {font-family:Neou; src:url(http://static.tumblr.com/9wzbixa/iozmj3lzw/neou-thin.otf); }
  19.  
  20.  
  21.  
  22.  
  23. body {
  24. background: #FFFFFF;
  25. font-size: 11px;
  26. color: #000000;
  27. font-family:helvetica;
  28.  
  29. }
  30.  
  31. a:link, a:active, a:visited {
  32. color: #ff0036;
  33. text-decoration: none;
  34. -webkit-transition: all 0.3s ease-out;
  35. -moz-transition: all 0.3s ease-out;
  36. transition: all 0.3s ease-out;
  37. }
  38.  
  39. a:hover {
  40. color: #ffccff;
  41. text-decoration: none;
  42. -webkit-transition: all 0.3s ease-out;
  43. -moz-transition: all 0.3s ease-out;
  44. transition: all 0.3s ease-out;
  45.  
  46. }
  47.  
  48. #sidebar {
  49.  
  50. width:100%;
  51. height:150px;
  52. top:0px;
  53. left:0px;
  54. background:#fffaff; /* SIDEBAR BACKGROUND COLOR */
  55. border-bottom: 1px solid #ff0066;
  56. }
  57.  
  58. /*--- dont worry if the sidebar stops abruptly when you scroll in the customize preview because the width is set to fill 100% of your screen width and it'll look fine on your blog---*/
  59.  
  60.  
  61.  
  62.  
  63. /* TITLE */
  64.  
  65. #stitle {
  66. font-family:"trebuchet ms";
  67. text-transform:lowercase;
  68. text-align:center;
  69. font-size:20px;
  70. letter-spacing:1px;
  71. color:#666; /* TITLE COLOR */
  72. padding-top:20px;
  73. }
  74.  
  75.  
  76.  
  77.  
  78. /*DESCRIPTION */
  79.  
  80. #description {
  81. font-family:helvetica;
  82. text-align:center;
  83. font-size:12px;
  84. color:#6c6c6c; /* DESCRIPTION TEXT COLOR */
  85. padding-top:10px;
  86. }
  87.  
  88.  
  89.  
  90.  
  91.  
  92.  
  93. /* EXTRA SIDEBAR LINKS */
  94.  
  95. #nav {
  96. font-family:Market Deco;
  97. letter-spacing:2px;
  98. text-align:center;
  99. text-transform:uppercase;
  100. font-size:11px;
  101. color:#ff0000;
  102. padding-top:10px;
  103. }
  104.  
  105. #nav a {
  106. color:#cc0066; /* NAVLINK COLOR */
  107. }
  108.  
  109. #nav a:hover {
  110. color:#ffccff;
  111. padding:10px;
  112. -moz-transition-duration:0.5s;
  113. -webkit-transition-duration:0.5s;
  114. -o-transition-duration:0.5s;
  115. }
  116.  
  117.  
  118.  
  119.  
  120.  
  121.  
  122. /* TAG CONTAINERS */
  123.  
  124. #container {
  125. width: 250px;
  126. height: auto;
  127. padding: 5px;
  128. margin-left:25px;
  129. padding: 5px;
  130. float: left;
  131. margin-top:-10px;
  132. }
  133.  
  134. #container2 {
  135. width: 250px;
  136. height: auto;
  137. padding: 5px;
  138. margin-left:325px;
  139. position:absolute;
  140. margin-top:-10px;
  141.  
  142.  
  143. }
  144.  
  145. #container3 {
  146. width: 250px;
  147. height: auto;
  148. padding: 5px;
  149. margin-left:625px;
  150. position:absolute;
  151. margin-top:-10px;
  152.  
  153.  
  154. }
  155. #container4 {
  156. width: 250px;
  157. height: auto;
  158. padding: 5px;
  159. margin-left:925px;
  160. position:absolute;
  161. margin-top:-10px;
  162.  
  163.  
  164.  
  165. }
  166.  
  167.  
  168.  
  169. /* ----------------------i wouldn't recommend adding an extra container unless you're comfortable with css and html because you'll have to manually alter the sidebar width (sorry) but here's the code------
  170. add this bit here under #container4
  171. #container5 {
  172. width: 250px;
  173. height: auto;
  174. padding: 5px;
  175. margin-left:1225px;
  176. position:absolute;
  177. margin-top:-10px;
  178.  
  179.  
  180. }
  181.  
  182. and this in the body right before the <!--- end coding--->
  183.  
  184. <div id="container5">
  185. <div id="name">NAME</div>
  186. <div id="firstcontainertext">
  187. <a href="/">link</a>
  188.  
  189. </div>
  190. <div id="containertext">
  191. <A href="/">link</A>
  192. <A href="/">link</A>
  193.  
  194. </div>
  195. <div id="lastcontainertext"><a href="/">link</a></div>
  196. </div>
  197.  
  198. -----
  199.  
  200. to add more containers you have to add 300px to the margin-left value for each subsequent container ---------------------
  201. to remove a container just delete the coding for the container under <body>*/
  202.  
  203.  
  204.  
  205.  
  206.  
  207.  
  208. /* LINKS ------ */
  209.  
  210.  
  211.  
  212.  
  213. /* FIRST LINK IN EACH CONTAINER */
  214.  
  215. #firstcontainertext {
  216. font-family: helvetica;
  217. font-size: 11px;
  218. }
  219.  
  220. #firstcontainertext a {
  221. display:block;
  222. background-color:#ffadd6; /* BACKGROUND COLOR */
  223. width:200px;
  224. border-top-left-radius:200px;
  225. border-top-right-radius:200px;
  226. opacity:1;
  227. line-height:200%;
  228. margin-bottom:5px;
  229. color:#660033; /* TEXT COLOR */
  230. letter-spacing:1px;
  231. text-decoration:none;
  232. text-align:center;
  233. -moz-transition-duration:.3s;
  234. -webkit-transition-duration:.3s;
  235. -o-transition-duration:.3s;
  236. }
  237.  
  238. #firstcontainertext a:hover {
  239. letter-spacing:4px;
  240. font-style:none;
  241. background-color:#ffe0ff;
  242. opacity:2;
  243. padding:0px;
  244. -moz-transition-duration:0.5s;
  245. -webkit-transition-duration:0.5s;
  246. -o-transition-duration:0.5s;
  247. }
  248.  
  249.  
  250.  
  251.  
  252. /* MIDDLE LINKS IN EACH CONTAINER */
  253.  
  254. #containertext {
  255. font-family: helvetica;
  256. font-size: 11px;
  257. }
  258.  
  259. #containertext a {
  260. display:block;
  261. background-color:#ffadd6; /* BACKGROUND COLOR */
  262. width:200px;
  263. opacity:1;
  264. line-height:185%;
  265. margin-bottom:5px;
  266. color:#660033; /* TEXT COLOR */
  267. letter-spacing:1px;
  268. text-decoration:none;
  269. text-align:center;
  270. -moz-transition-duration:.3s;
  271. -webkit-transition-duration:.3s;
  272. -o-transition-duration:.3s;
  273. }
  274.  
  275. #containertext a:hover {
  276. letter-spacing:4px;
  277. font-style:none;
  278. background-color:#ffe0ff;
  279. opacity:2;
  280. padding:0px;
  281. -moz-transition-duration:0.5s;
  282. -webkit-transition-duration:0.5s;
  283. -o-transition-duration:0.5s;
  284. }
  285.  
  286.  
  287.  
  288.  
  289. /* LAST LINK IN EACH CONTAINER */
  290.  
  291. #lastcontainertext {
  292. font-family: helvetica;
  293. font-size: 11px;
  294. }
  295.  
  296. #lastcontainertext a {
  297. display:block;
  298. background-color:#ffadd6; /* BACKGROUND COLOR */
  299. width:200px;
  300. border-bottom-left-radius:200px;
  301. border-bottom-right-radius:200px;
  302. opacity:1;
  303. line-height:200%;
  304. margin-bottom:5px;
  305. color:#660033; /* TEXT COLOR */
  306. letter-spacing:1px;
  307. text-decoration:none;
  308. text-align:center;
  309. -moz-transition-duration:.3s;
  310. -webkit-transition-duration:.3s;
  311. -o-transition-duration:.3s;
  312. }
  313.  
  314. #lastcontainertext a:hover {
  315. letter-spacing:4px;
  316. font-style:none;
  317. background-color:#ffe0ff;
  318. opacity:2;
  319. padding:0px;
  320. -moz-transition-duration:0.5s;
  321. -webkit-transition-duration:0.5s;
  322. -o-transition-duration:0.5s;
  323. }
  324.  
  325.  
  326.  
  327.  
  328. /* CONTAINER TITLE */
  329.  
  330. #name {
  331. width:125px;
  332. font-family: helvetica;
  333. font-size: 14px;
  334.  
  335. text-transform:uppercase;
  336. text-align: center;
  337. color: #000000; /* TITLE COLOR */
  338. margin-top:50px;
  339. padding-bottom:10px;
  340. padding-left:40px;
  341. }
  342.  
  343.  
  344. /* CREDIT DO NOT EDIT */
  345.  
  346. #credit {
  347. bottom:0px;
  348. right:5px;
  349. font-size:30px;
  350. position:fixed;
  351.  
  352. }
  353.  
  354. .cr {
  355. background:transparent;}
  356.  
  357. #credit a {
  358. color:#ff0066;
  359. }
  360.  
  361. #credit a:hover {
  362. color:#ffccff;
  363. }
  364.  
  365. .theme {
  366. width:0px;
  367. background:#ff0066;
  368. color:#fff;
  369. height:18px;
  370. font-size:10px;
  371. padding-top:2px;
  372. visibility:hidden; position:fixed;
  373. margin-top:-25px;
  374. text-align:center;
  375. text-transform:uppercase;
  376.  
  377. }
  378.  
  379.  
  380.  
  381. .cr:hover .theme {
  382. visibility:visible;
  383. width:200px;
  384. margin-left:-200px;
  385.  
  386. transition:0.6s;
  387. }
  388.  
  389. </style>
  390. </head>
  391.  
  392.  
  393.  
  394.  
  395. <body>
  396.  
  397. <div id="sidebar">
  398.  
  399. <div id="stitle">title</div><!--- ADD YOUR TITLE HERE --->
  400.  
  401. <div id="description">keep the description short <br>no more than a couple of lines<br> <a href="/">link</a>, <em>italics</em>, <u>underline</u>, <Strong>bold</Strong></div>
  402.  
  403. <div id="nav">
  404. <a href="/">home</a>&nbsp; &nbsp;
  405. <a href="/ask">ask</a>&nbsp; &nbsp;
  406. <a href="/">link 1</a>&nbsp; &nbsp;
  407. <A href="/">link 2</A>&nbsp; &nbsp;
  408. <!--- TO ADD MORE LINKS COPY THE SAME PATTERN--->
  409. </div>
  410.  
  411. </div>
  412.  
  413.  
  414.  
  415.  
  416. <!--- FIRST CONTAINER--->
  417. <div id="container">
  418.  
  419. <div id="name">NAME</div>
  420.  
  421. <div id="firstcontainertext">
  422.  
  423. <a href="/tagged/">link</a> <!--- FIRST LINK--->
  424.  
  425. </div>
  426.  
  427. <div id="containertext">
  428.  
  429. <a href="/tagged/">link</a>
  430.  
  431. <a href="/tagged/">link</a>
  432.  
  433. <a href="/tagged/">link</a>
  434.  
  435. <a href="/tagged/">link</a>
  436.  
  437. <a href="/tagged/">link</a>
  438.  
  439. <a href="/tagged/">link</a>
  440.  
  441. <a href="/tagged/">link</a>
  442.  
  443. <a href="/tagged/">link</a>
  444.  
  445. <a href="/tagged/">link</a>
  446.  
  447. <a href="/tagged/">link</a>
  448.  
  449. <a href="/tagged/">link</a>
  450.  
  451. <a href="/tagged/">link</a>
  452.  
  453. <a href="/tagged/">link</a>
  454.  
  455. <a href="/tagged/">link</a>
  456.  
  457. <!--- COPY/PASTE AS MANY OF THESE LINKS AS YOU NEED--->
  458. </div>
  459.  
  460. <div id="lastcontainertext">
  461.  
  462. <a href="/tagged/">link</a>
  463.  
  464.  
  465. </div><!--- LAST LINK
  466. PLEASE DO NOT DELETE THE CODE FOR THE FIRST OR LAST LINK - AND LET THERE BE ONLY ONE OF EACH--->
  467. </div>
  468.  
  469.  
  470.  
  471.  
  472.  
  473.  
  474.  
  475. <!--- SECOND CONTAINER (CODES FOLLOW THE SAME PATTERN AS THE FIRST) --->
  476.  
  477. <div id="container2">
  478.  
  479. <div id="name">NAME</div>
  480.  
  481. <div id="firstcontainertext">
  482.  
  483. <a href="/tagged/">link</a>
  484.  
  485.  
  486. </div>
  487.  
  488. <div id="containertext">
  489.  
  490. <a href="/tagged/">link</a>
  491.  
  492. <a href="/tagged/">link</a>
  493.  
  494. <a href="/tagged/">link</a>
  495.  
  496. <a href="/tagged/">link</a>
  497.  
  498. <a href="/tagged/">link</a>
  499.  
  500. <a href="/tagged/">link</a>
  501.  
  502. <a href="/tagged/">link</a>
  503.  
  504. <a href="/tagged/">link</a>
  505.  
  506. <a href="/tagged/">link</a>
  507.  
  508. <a href="/tagged/">link</a>
  509.  
  510. <a href="/tagged/">link</a>
  511.  
  512. <a href="/tagged/">link</a>
  513.  
  514. <a href="/tagged/">link</a>
  515.  
  516. <a href="/tagged/">link</a>
  517.  
  518. </div>
  519.  
  520. <div id="lastcontainertext">
  521.  
  522. <a href="/tagged/">link</a>
  523.  
  524. </div>
  525. </div>
  526.  
  527.  
  528.  
  529.  
  530.  
  531.  
  532. <!--- THIRD CONTAINER --->
  533.  
  534. <div id="container3">
  535.  
  536. <div id="name">NAME</div>
  537.  
  538. <div id="firstcontainertext">
  539.  
  540. <a href="/tagged/">link</a>
  541.  
  542. </div>
  543.  
  544. <div id="containertext">
  545.  
  546. <a href="/tagged/">link</a>
  547.  
  548. <a href="/tagged/">link</a>
  549.  
  550. <a href="/tagged/">link</a>
  551.  
  552. <a href="/tagged/">link</a>
  553.  
  554. <a href="/tagged/">link</a>
  555.  
  556. <a href="/tagged/">link</a>
  557.  
  558. <a href="/tagged/">link</a>
  559.  
  560. <a href="/tagged/">link</a>
  561.  
  562. <a href="/tagged/">link</a>
  563.  
  564. <a href="/tagged/">link</a>
  565.  
  566. <a href="/tagged/">link</a>
  567.  
  568. <a href="/tagged/">link</a>
  569.  
  570. <a href="/tagged/">link</a>
  571.  
  572. <a href="/tagged/">link</a>
  573.  
  574.  
  575. </div>
  576.  
  577. <div id="lastcontainertext">
  578.  
  579. <a href="/tagged/">link</a>
  580.  
  581. </div>
  582. </div>
  583.  
  584.  
  585.  
  586.  
  587.  
  588.  
  589. <!--- FOURTH CONTAINER --->
  590.  
  591. <div id="container4">
  592.  
  593. <div id="name">NAME</div>
  594.  
  595. <div id="firstcontainertext">
  596.  
  597. <a href="/tagged/">link</a>
  598.  
  599. </div>
  600.  
  601. <div id="containertext">
  602.  
  603. <a href="/tagged/">link</a>
  604.  
  605. <a href="/tagged/">link</a>
  606.  
  607. <a href="/tagged/">link</a>
  608.  
  609. <a href="/tagged/">link</a>
  610.  
  611. <a href="/tagged/">link</a>
  612.  
  613. <a href="/tagged/">link</a>
  614.  
  615. <a href="/tagged/">link</a>
  616.  
  617. <a href="/tagged/">link</a>
  618.  
  619. <a href="/tagged/">link</a>
  620.  
  621. <a href="/tagged/">link</a>
  622.  
  623. <a href="/tagged/">link</a>
  624.  
  625. <a href="/tagged/">link</a>
  626.  
  627. <a href="/tagged/">link</a>
  628.  
  629. <a href="/tagged/">link</a>
  630.  
  631. </div>
  632.  
  633. <div id="lastcontainertext">
  634.  
  635. <a href="/tagged/">link</a>
  636.  
  637. </div>
  638. </div>
  639.  
  640.  
  641.  
  642.  
  643.  
  644.  
  645. <!--- END CODING
  646. PLEASE DO NOT REMOVE CREDIT --->
  647.  
  648.  
  649. <div id="credit"><div class="cr"><a href="http://jasnahdavar.tumblr.com">©</a>
  650. <div class="theme">theme by jasnahdavar</div></div>
  651. </div>
  652.  
  653. </body>
  654. </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!