API tools faq
paste
the49thname

Tags 01

the49thname
Jul 12th, 2016
5,216
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.44 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. <head>
  4.  
  5. <!-- tags page 01
  6.  
  7. themes by ro (the49thname) / the49ththeme.tumblr.com
  8. isotope filtering code by zsu (themesbyzsu) / themesbyzsu.tumblr.com
  9. don't remove the credit, use as a base code, or claim as your own work.
  10. edit as much as you want, and feel free to send me any queries/problems.
  11.  
  12. -->
  13.  
  14. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  15.  
  16. <title>Tags 01</title>
  17.  
  18. <link rel="shortcut icon" href="{Favicon}">
  19.  
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21.  
  22. <meta name="description" content="{MetaDescription}" />
  23.  
  24. <!-- fonts -->
  25.  
  26. <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
  27.  
  28. <!-- jquery scripts -->
  29.  
  30. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  31.  
  32. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  33.  
  34. <!-- font awesome script -->
  35.  
  36. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  37.  
  38. <!-- tooltip scripts -->
  39.  
  40. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  41.  
  42. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  43.  
  44. <script>
  45. (function($){
  46. $(document).ready(function(){
  47. $("a[title]").style_my_tooltips({
  48. tip_follows_cursor:true,
  49. tip_delay_time:90,
  50. tip_fade_speed:600,
  51. attribute:"title"
  52. });
  53. });
  54. })(jQuery);
  55. </script>
  56.  
  57. <style type="text/css">
  58.  
  59. #tumblr_controls, .tmblr-iframe {display:none;!important;}
  60.  
  61. ::-webkit-scrollbar-thumb {
  62. z-index:9999999;
  63. position:relative;
  64. height:auto;
  65. background-color:#ccc; /* change scrollbar thumb colour */
  66. }
  67.  
  68. ::-webkit-scrollbar {
  69. height:5px;
  70. width:5px;
  71. background-color:#f6f6f6; /* change scrollbar background colour */
  72. }
  73.  
  74. /* basics */
  75.  
  76. body {
  77. color:#888; /* change text colour */
  78. background-color:#f6f6f6; /* change background colour */
  79. font-family:'Roboto', sans-serif;
  80. font-size:10px; /* change text font size */
  81. margin:0;
  82. line-height:14px;
  83. letter-spacing:1px;
  84. text-align:justify;
  85. word-wrap:break-word;
  86. background-image:url('URL goes here'); /* add background image */
  87. background-position:left top;
  88. background-attachment:fixed;
  89. background-repeat:repeat;
  90. }
  91.  
  92. b, strong {color:#000;} /* change bold text colour */
  93.  
  94. i, em {color:#ccc;} /* change italic text colour */
  95.  
  96. u {color:#888;text-transform:none;} /* change underline text colour */
  97.  
  98. a {
  99. color:#ffb3b3; /* change link colour */
  100. text-transform:uppercase;
  101. text-decoration:none;
  102. -moz-transition-duration:1s;
  103. -webkit-transition-duration:1s;
  104. -o-transition-duration:1s;
  105. }
  106.  
  107. a:hover {
  108. color:#888; /* change link hover colour */
  109. -moz-transition-duration:1s;
  110. -webkit-transition-duration:1s;
  111. -o-transition-duration:1s;
  112. }
  113.  
  114. /* header */
  115.  
  116. #themecontainer {
  117. top:0;
  118. width:900px;
  119. height:100%;
  120. margin-left:auto;
  121. margin-right:auto;
  122. }
  123.  
  124. #hdr {
  125. width:900px;
  126. height:200px;
  127. position:absolute;
  128. top:0;
  129. background:url('https://68.media.tumblr.com/b0c1aeb55f3bc4ff5c2c2724bfcff9df/tumblr_o6q1oxxgiE1uptww3o2_1280.png') top center; /* add/change header image */
  130. -webkit-background-size:cover;
  131. -moz-background-size:cover;
  132. -o-background-size:cover;
  133. background-size:cover;
  134. }
  135.  
  136. .nav {
  137. position:absolute;
  138. top:200px;
  139. width:900px;
  140. height:35px;
  141. background-color:#ffb3b3; /* change navigation background colour */
  142. text-align:center;
  143. z-index:9999;
  144. }
  145.  
  146. .nav-fixed {position:fixed;top:0;}
  147.  
  148. .nav ul {margin:0px!important;padding:0px!important;}
  149.  
  150. .nav li {
  151. list-style:none;
  152. display:inline-block;
  153. padding:12px 8px;
  154. }
  155.  
  156. .nav a {
  157. font-family:'Roboto Condensed', sans-serif;
  158. font-size:14px;
  159. text-transform:uppercase;
  160. color:#fff; /* change navigation link colour */
  161. -moz-transition-duration:1s;
  162. -webkit-transition-duration:1s;
  163. -o-transition-duration:1s;
  164. }
  165.  
  166. .nav a:hover {
  167. color:#888; /* change navigation link hover colour */
  168. -moz-transition-duration:1s;
  169. -webkit-transition-duration:1s;
  170. -o-transition-duration:1s;
  171. }
  172.  
  173. .nav li a.selected {
  174. color:#888; /* change navigation link selected colour */
  175. -moz-transition-duration:1s;
  176. -webkit-transition-duration:1s;
  177. -o-transition-duration:1s;
  178. }
  179.  
  180. #buttons, #buttons2 {position:fixed;top:35px;z-index:99999;}
  181.  
  182. #buttons {left:50%;margin-left:-510px;}
  183.  
  184. #buttons2 {right:50%;margin-right:-510px;}
  185.  
  186. #buttons c, #buttons2 c {
  187. display:block;
  188. background-color:#fff; /* change box link colour */
  189. margin-bottom:10px;
  190. padding:10px;
  191. font-size:20px;
  192. }
  193.  
  194. /* posts */
  195.  
  196. #postcontainer {
  197. position:relative;
  198. top:235px;
  199. width:100%;
  200. overflow:hidden;
  201. text-align:justify;
  202. background-color:#fff; /* change container background colour */
  203. }
  204.  
  205. #container {
  206. width:750px;
  207. height:100%;
  208. margin:50px auto;
  209. }
  210.  
  211. .tagscont {
  212. width:200px;
  213. margin:20px;
  214. transition-duration:1.5s;
  215. -moz-transition-duration:1.5s;
  216. -webkit-transition-duration:1.5s;
  217. -o-transition-duration:1.5s;
  218. }
  219.  
  220. h2 {
  221. color:#fff; /* change tags header text colour */
  222. background-color:#bad8eb; /* change tags header background colour */
  223. font-size:12px;
  224. font-weight:700;
  225. letter-spacing:3px;
  226. text-transform:uppercase;
  227. text-align:left;
  228. padding:10px;
  229. margin-top:0px;
  230. margin-bottom:0px;
  231. }
  232.  
  233. .tags {text-align:left;}
  234.  
  235. .tags a {
  236. color:#888; /* change tags text colour */
  237. background-color:#f6f6f6; /* change tags background colour */
  238. font-size:9px;
  239. font-weight:bold;
  240. text-transform:uppercase;
  241. overflow:hidden;
  242. display:block;
  243. padding:10px;
  244. -moz-transition-duration:1s;
  245. -webkit-transition-duration:1s;
  246. -o-transition-duration:1s;
  247. }
  248.  
  249. .tags a:hover {
  250. color:#fff; /* change tags text hover colour */
  251. background-color:#ffb3b3; /* change tags background hover colour */
  252. -moz-transition-duration:1s;
  253. -webkit-transition-duration:1s;
  254. -o-transition-duration:1s;
  255. }
  256.  
  257. /* extras */
  258.  
  259. #s-m-t-tooltip {
  260. z-index:9999999999;
  261. color:#fff; /* change tooltip text colour */
  262. background:#bad8eb; /* change tooltip background colour */
  263. font-size:9px;
  264. line-height:11px;
  265. font-family:'Roboto Condensed', sans-serif;
  266. text-align:left;
  267. text-transform:uppercase;
  268. max-width:150px;
  269. word-wrap:break-word;
  270. padding:2px 5px 2px 5px;
  271. display:block;
  272. margin:24px 14px 7px 12px;
  273. }
  274.  
  275. ::selection {
  276. color:#fff; /* change selection text colour */
  277. background:#ffb3b3; /* change selection background colour */
  278. }
  279.  
  280. /* credit - do not remove, alter, or move to another page */
  281.  
  282. #credit {
  283. position:fixed;
  284. bottom:14px;
  285. right:10px;
  286. text-align:center;
  287. z-index:9999999;
  288. }
  289.  
  290. #credit a {
  291. font-size:10px;
  292. color:#f6f6f6;
  293. background-color:#ccc;
  294. padding:4px;
  295. -moz-transition-duration:1s;
  296. -webkit-transition-duration:1s;
  297. -o-transition-duration:1s;
  298. }
  299.  
  300. #credit a:hover {
  301. color:#ccc;
  302. background-color:#f6f6f6;
  303. -moz-transition-duration:1s;
  304. -webkit-transition-duration:1s;
  305. -o-transition-duration:1s;
  306. }
  307.  
  308. </style>
  309. </head>
  310. <body>
  311.  
  312. <div id="buttons">
  313. <a href="/" title="return home"><c class="fa fa-home"></c></a>
  314. <a href="/ask" title="send a message"><c class="fa fa-envelope"></c></a>
  315. <a href="/archive" title="view archive"><c class="fa fa-calendar"></c></a>
  316. </div>
  317.  
  318. <div id="buttons2">
  319. <!-- you can edit your custom links here (the boxes on the right hand side of the container). simply copy and paste the relevant urls where it says "LINK NO. URL" and add in a summary of the link location (e.g. "admin's blog") where it says "LINK NO. HOVER TEXT". -->
  320. <a href="LINK 1 URL" title="LINK 1 HOVER TEXT"><c class="fa fa-star"></c></a>
  321. <a href="LINK 2 URL" title="LINK 2 HOVER TEXT"><c class="fa fa-heart"></c></a>
  322. <a href="LINK 3 URL" title="LINK 3 HOVER TEXT"><c class="fa fa-list"></c></a>
  323. </div>
  324.  
  325. <div id="themecontainer">
  326.  
  327. <div id="hdr"></div>
  328.  
  329. <div class="nav">
  330. <ul id="filters" class="option-set clearfix" data-option-key="filter">
  331. <li><a href="#filter" data-option-filter=".tagscont" class="selected">all tags</a></li>
  332.  
  333. <!-- here is where you can edit your tag filters. all you need to do is change what's between the speech-marks "" after data-option-filter= to whatever div class you use for your tag sections below (e.g. data-option-filter=".general"). MAKE SURE TO PUT A FULL STOP/PERIOD BEFORE YOUR DIV CLASS NAME OTHERWISE IT WON'T WORK!! you also need to have unique div class names for each filter (so you can't have two .general filters otherwise it won't work) and the div class name has to be all one word. you also need to change what's just before </a> to whatever you want your tag filter link up on the navigation bar at the top to be (e.g. general/fandom tags/etc.)
  334.  
  335. here are examples in case you are stuck:
  336.  
  337. <li><a href="#filter" data-option-filter=".fandoms">fandoms</a></li>
  338. <li><a href="#filter" data-option-filter=".mine">my stuff</a></li>
  339. <li><a href="#filter" data-option-filter=".pairings">pairings</a></li>
  340. <li><a href="#filter" data-option-filter=".characters">characters</a></li>
  341.  
  342. -->
  343.  
  344. <li><a href="#filter" data-option-filter=".div1">link 1</a></li>
  345. <li><a href="#filter" data-option-filter=".div2">link 2</a></li>
  346. <li><a href="#filter" data-option-filter=".div3">link 3</a></li>
  347. <li><a href="#filter" data-option-filter=".div4">link 4</a></li>
  348. <li><a href="#filter" data-option-filter=".div5">link 5</a></li>
  349. <li><a href="#filter" data-option-filter=".div6">link 6</a></li>
  350.  
  351. <!-- to add more links simply copy and paste the following line of code just after this info section (make sure it's pasted after the - - >
  352.  
  353. <li><a href="#filter" data-option-filter=".div class name">link</a></li>
  354.  
  355. you'll need to make a new tags section below so the link works -->
  356.  
  357. </ul>
  358. </div>
  359.  
  360. <div id="postcontainer">
  361.  
  362. <div id="container" class="clearfix">
  363.  
  364. <!-- here is where your tag sections are. PLEASE NOTE: YOU /MUST/ MAKE SURE THAT AFTER DIV CLASS= YOU HAVE INCLUDED AT LEAST /ONE/ DIV CLASS NAME THAT YOU GAVE ONE OF THE LINKS ABOVE, OTHERWISE THE FILTERS WON'T WORK!! here is an example so you know what to do:
  365.  
  366. here is an example link from above:
  367.  
  368. <li><a href="#filter" data-option-filter=".fandoms">fandoms</a></li>
  369.  
  370. "fandoms" (from the data-option-filter="" bit) is the important thing to include!! so in one of your tags sections you need it to look like this:
  371.  
  372. <div class="tagscont fandoms">
  373. <h2>Title</h2>
  374. <div class="tags">
  375. ///// TAGS /////
  376. </div>
  377. </div>
  378.  
  379. you /MUST/ have tagscont followed by whatever div class name you gave one of your filter links above, otherwise it won't work. as you can see i put "fandoms" after "tagscont" so that when you click on the link on the navigation bar that says "fandoms", it will sort your tags so that only sections with the word "fandoms" included as one of its div classes will show.
  380.  
  381. you can include more than one div class name, so if we follow the example above if you had another filter link with a div class of ".characters" you could have a tags section that had the following div classes:
  382.  
  383. <div class="tagscont fandoms characters">
  384. .... etc. ......
  385.  
  386. that way when you click on either the "fandoms" or "characters" link it will show those tags. you can also have more than one tag section using the same div class. -->
  387.  
  388. <div class="tagscont div1">
  389. <h2>Title</h2>
  390. <div class="tags">
  391. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  392. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  393. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  394. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  395. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  396. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  397. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  398. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  399. </div>
  400. </div>
  401.  
  402. <div class="tagscont div2">
  403. <h2>Title</h2>
  404. <div class="tags">
  405. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  406. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  407. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  408. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  409. </div>
  410. </div>
  411.  
  412. <div class="tagscont div2">
  413. <h2>Title</h2>
  414. <div class="tags">
  415. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  416. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  417. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  418. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  419. </div>
  420. </div>
  421.  
  422. <div class="tagscont div3">
  423. <h2>Title</h2>
  424. <div class="tags">
  425. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  426. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  427. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  428. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  429. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  430. </div>
  431. </div>
  432.  
  433. <div class="tagscont div3">
  434. <h2>Title</h2>
  435. <div class="tags">
  436. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  437. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  438. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  439. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  440. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  441. </div>
  442. </div>
  443.  
  444. <div class="tagscont div3">
  445. <h2>Title</h2>
  446. <div class="tags">
  447. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  448. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  449. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  450. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  451. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  452. </div>
  453. </div>
  454.  
  455. <div class="tagscont div4">
  456. <h2>Title</h2>
  457. <div class="tags">
  458. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  459. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  460. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  461. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  462. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  463. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  464. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  465. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  466. </div>
  467. </div>
  468.  
  469. <div class="tagscont div5">
  470. <h2>Title</h2>
  471. <div class="tags">
  472. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  473. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  474. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  475. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  476. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  477. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  478. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  479. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  480. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  481. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  482. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  483. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  484. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  485. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  486. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  487. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  488. </div>
  489. </div>
  490.  
  491. <div class="tagscont div5">
  492. <h2>Title</h2>
  493. <div class="tags">
  494. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  495. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  496. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  497. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  498. </div>
  499. </div>
  500.  
  501. <div class="tagscont div6">
  502. <h2>Title</h2>
  503. <div class="tags">
  504. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  505. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  506. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  507. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  508. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  509. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  510. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  511. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  512. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  513. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  514. </div>
  515. </div>
  516.  
  517. <div class="tagscont div6">
  518. <h2>Title</h2>
  519. <div class="tags">
  520. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  521. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  522. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  523. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  524. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  525. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  526. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  527. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  528. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  529. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  530. </div>
  531. </div>
  532.  
  533. <div class="tagscont div6">
  534. <h2>Title</h2>
  535. <div class="tags">
  536. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  537. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  538. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  539. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  540. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  541. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  542. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  543. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  544. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  545. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  546. </div>
  547. </div>
  548.  
  549. <!-- to add more tags simply copy and paste the following section of code:
  550.  
  551. <div class="tagscont divclassname">
  552. <h2>Title</h2>
  553. <div class="tags">
  554. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  555. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  556. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  557. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  558. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  559. <a href="/tagged/TAG NAME" target="_blank">#TAG NAME</a>
  560. </div>
  561. </div>
  562.  
  563. and paste it somewhere before the </div></div> just below these instructions and MAKE SURE TO EDIT THE DIV CLASS NAME TO MATCH WHATEVER YOU USE FOR YOUR FILTER LINKS -->
  564.  
  565. </div>
  566. </div>
  567.  
  568. </div>
  569.  
  570. <div id="credit"><a href="http://the49thname.tumblr.com/" title="made by the49thname">49</a>
  571. </div>
  572.  
  573. </body>
  574.  
  575. <!-- sticky navbar jquery -->
  576.  
  577. <script>
  578. $(document).ready(function(){
  579. $(window).bind('scroll', function(){
  580. if($(window).scrollTop() > 200){
  581. $('.nav').addClass('nav-fixed');
  582. }
  583.  
  584. else{
  585. $('.nav').removeClass('nav-fixed');
  586. }
  587. });
  588. });
  589. </script>
  590.  
  591. <!------- filter scripts -------->
  592.  
  593. <script src="http://static.tumblr.com/fuu6t9w/kh8ml0pl9/jquery-1.7.1.min.js"></script>
  594.  
  595. <script src="http://static.tumblr.com/fuu6t9w/eubml0pm0/jquery.isotope.min.js"></script>
  596.  
  597. <script>
  598. $(function(){
  599.  
  600. var $container = $('#container');
  601.  
  602. $container.isotope({
  603. itemSelector : '.tagscont'
  604. });
  605.  
  606.  
  607. var $optionSets = $('.nav .option-set'),
  608. $optionLinks = $optionSets.find('a');
  609.  
  610. $optionLinks.click(function(){
  611. var $this = $(this);
  612. // don't proceed if already selected
  613. if ( $this.hasClass('selected') ) {
  614. return false;
  615. }
  616. var $optionSet = $this.parents('.option-set');
  617. $optionSet.find('.selected').removeClass('selected');
  618. $this.addClass('selected');
  619.  
  620. // make option object dynamically, i.e. { filter: '.my-filter-class' }
  621. var options = {},
  622. key = $optionSet.attr('data-option-key'),
  623. value = $this.attr('data-option-filter');
  624. // parse 'false' as false boolean
  625. value = value === 'false' ? false : value;
  626. options[ key ] = value;
  627. if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
  628. // changes in layout modes need extra logic
  629. changeLayoutMode( $this, options )
  630. } else {
  631. // otherwise, apply new options
  632. $container.isotope( options );
  633. }
  634.  
  635. return false;
  636. });
  637.  
  638.  
  639. });
  640. </script>
  641.  
  642. <!-----end filter scripts------>
  643.  
  644. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!