API tools faq
paste
Advertisement
voicelessthemes

Theme #2

voicelessthemes
Mar 29th, 2017
125
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 15.42 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!---THEME #2 BY VOICELESSTHEMES
  6. DO NOT CLAIM AS YOUR OWN OR STEAL PARTS OF MY CODE
  7. LEAVE CREDIT INTACT--->
  8.  
  9.     <title>{Title}</title>
  10.     <link rel="shortcut icon" href="{Favicon}">
  11.     <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12.     {block:Description}
  13.         <meta name="description" content="{MetaDescription}" />
  14.     {/block:Description}
  15.    
  16.    
  17. <meta name="select:Font" content="font-family: 'Economica', sans-serif;" title="Sans-serif" />
  18. <meta name="select:Font" content="font-family: 'Slabo 27px', serif;" title="Serif" />
  19.  
  20. <meta name="color:Page Background" content="#c1128e" />
  21. <meta name="color:Links" content="#e54172" />
  22. <meta name="color:Links Hover" content="#e3a1a1" />
  23. <meta name="color:Scrollbar Background" content="#c1128e" />
  24. <meta name="color:Scrollbar Foreground" content="#000" />
  25. <meta name="color:TopBar Background" content="#000" />
  26. <meta name="color:TopBar Links" content="#7a0b54" />
  27. <meta name="color:TopBar Links Hover" content="#fff" />
  28. <meta name="color:Blog Title" content="white" />
  29. <meta name="color:Description Links" content="#e54172" />
  30. <meta name="color:Description Links Hover" content="#c1128e" />
  31.  
  32. <meta name="image:Page Background" content="" />
  33. <meta name="image:Sidebar Image" content="" />
  34.  
  35. <meta name="if:FullPageBackground" content="0" title="Full-Page Background" />
  36. <meta name="if:PaginationUnderPosts" content="0" title="Pagination Under Posts" />
  37. <meta name="if:ShowAskLink" content="0" title="Show Ask Link" />
  38.  
  39. <meta name="if:Link1" content="0" title="Custom Link 1" />
  40. <meta name="text:Link 1 URL" content="/" />
  41. <meta name="text:Link 1 Title" content="" />
  42. <meta name="if:Link2" content="0" title="Custom Link 2" />
  43. <meta name="text:Link 2 URL" content="/" />
  44. <meta name="text:Link 2 Title" content="" />
  45. <meta name="if:Link3" content="0" title="Custom Link 3" />
  46. <meta name="text:Link 3 URL" content="/" />
  47. <meta name="text:Link 3 Title" content="" />
  48. <meta name="if:Link4" content="0" title="Custom Link 4" />
  49. <meta name="text:Link 4 URL" content="/" />
  50. <meta name="text:Link 4 Title" content="" />
  51. <meta name="if:Link5" content="0" title="Custom Link 5" />
  52. <meta name="text:Link 5 URL" content="/" />
  53. <meta name="text:Link 5 Title" content="" />
  54. <meta name="if:Link6" content="0" title="Custom Link 6" />
  55. <meta name="text:Link 6 URL" content="/" />
  56. <meta name="text:Link 6 Title" content="" />
  57.  
  58. <!--EXTERNAL SCRIPTS-->
  59.  
  60. <!--JQUERY-->
  61. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  62.  
  63. <!--SHYTHEMES VIDEO RESIZING SCRIPT-->
  64. <script src ="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  65.  
  66. <!--PIXELUNION PHOTOSETS-->
  67. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  68.  
  69. <!--MASONRY SCRIPT-->
  70. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  71.  
  72. <!--EXTERNAL STYLESHEETS-->
  73.  
  74. <!--GOOGLE FONTS-->
  75. <link href='https://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'>
  76. <link href='https://fonts.googleapis.com/css?family=Slabo+27px' rel='stylesheet' type='text/css'>
  77.  
  78. <!--PIXELUNION PHOTOSETS-->
  79. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  80.  
  81. <style>
  82. body {
  83.     background-image: url({image:Page Background});
  84.     color: white;
  85.     {select:Font}
  86.     background-attachment: fixed;
  87.     background-color: {color:Page Background};
  88.     {block:IfFullPageBackground}background-size: cover;{/block:IfFullPageBackground}
  89.     {block:IfNotFullPageBackground}background-size: auto;{/block:IfNotFullPageBackground}
  90. }
  91.  
  92. a {
  93.     text-decoration: none;
  94.     color: {color:Links};
  95.     transition: all 0.5s ease-in-out;
  96.     -o-transition: all 0.5s ease-in-out;
  97.     -ms-transition: all 0.5s ease-in-out;
  98.     -webkit-transition: all 0.5s ease-in-out;
  99.     -moz-transition: all 0.5s ease-in-out;
  100. }
  101.  
  102. a:hover {
  103.     color: {color:Links Hover};
  104.     transition: all 0.5s ease-in-out;
  105.     -o-transition: all 0.5s ease-in-out;
  106.     -ms-transition: all 0.5s ease-in-out;
  107.     -webkit-transition: all 0.5s ease-in-out;
  108.     -moz-transition: all 0.5s ease-in-out;
  109. }
  110.  
  111. ::-webkit-scrollbar {
  112.     height: 10px;
  113.     width: 10px;
  114. }
  115.  
  116. /* Track */
  117. ::-webkit-scrollbar-track {
  118.     background: {color:Scrollbar Background};
  119. }
  120.  
  121. /* Handle */
  122. ::-webkit-scrollbar-thumb {
  123.     background-color: {color:Scrollbar Foreground};
  124.     border: solid 4px {color:Scrollbar Background};
  125. }
  126.  
  127. .top {
  128.     position: fixed;
  129.     top: 0px;
  130.     right: 0px;
  131.     left: 0px;
  132.     height: 40px;
  133.     background: {color:TopBar Background};
  134.     z-index: 2;
  135.     padding: 5px;
  136.     border-bottom: solid white 2px;
  137. }
  138.  
  139. .top img {
  140.     position: fixed;
  141.     top: 5px;
  142.     left: 30px;
  143.     width: 35px;
  144.     height: 35px;
  145.     border: solid 2px white;
  146.     border-radius: 30px;
  147. }
  148.  
  149. .top a {
  150.     padding: 0px 5px;
  151.     line-height: 40px;
  152.     font-size: 20px;
  153.     display:inline-block;
  154.     color: {color:TopBar Links};
  155.     margin: 0px 10px;
  156.     letter-spacing: -1px;
  157. }
  158.  
  159. .top a:hover {
  160.     text-decoration:none;
  161.     color: {color:TopBar Links Hover};
  162.     letter-spacing: 5px;
  163. }
  164.  
  165. .sidebar {
  166.     position: fixed;
  167.     left: 50px;
  168.     top: 120px;
  169.     width: 250px;
  170.     padding: 5px;
  171.     background: rgba(0,0,0,0.9);
  172.     border-radius: 5px;
  173.     z-index: 3;
  174.     height: auto;
  175. }
  176.  
  177. .sidebar h1 {
  178.     font-size: 24px;
  179.     line-height: 34px;
  180.     font-weight: bold;
  181.     color: {color:Blog Title};
  182. }
  183.  
  184. .sidebar img {
  185.     height: auto;
  186.     width: 240px;
  187.     margin: 5px;
  188.     border-radius: 5px;
  189.    
  190. }
  191.  
  192. .sidebar .desc {
  193.     font-size: 13px;
  194.     padding: 5px;
  195.     max-height: 120px;
  196.     overflow-y: scroll;
  197.     background-color: rgba(0,0,0,0.9);
  198. }
  199.  
  200. .sidebar .desc p {
  201.     margin: 4px;
  202. }
  203.  
  204. .sidebar .desc a {
  205.     color: {color:Description Links};
  206. }
  207.  
  208. .sidebar .desc a:hover {
  209.     color: {color:Description Links Hover};
  210. }
  211.  
  212. .sidebar h3 {
  213.     font-size: 18px;
  214.     font-weight: 600;
  215.     text-transform: uppercase;
  216.     margin: 5px;
  217. }
  218.    
  219.     #post-content {
  220.         background: transparent;
  221.         margin: 80px auto 20px calc(50% - 300px);
  222.         height: 100%;
  223.         width: 700px;
  224.     }
  225.    
  226.     .post {
  227.         {block:IndexPage}width: 300px;{/block:IndexPage}
  228.         {block:PermalinkPage}width: 500px;{/block:PermalinkPage}
  229.         float: left;
  230.         margin: 10px;
  231.         background: rgba(0,0,0,0.9);
  232.         padding: 10px;
  233.         border-radius: 5px;
  234.         text-align: justify;
  235.         z-index: 1;
  236.     }
  237.  
  238.     .post img {
  239.         max-width: 100%;
  240.         height: auto;
  241.     }
  242.  
  243.     .post .title {
  244.         {block:PermalinkPage}font-size: 30px;{/block:PermalinkPage}
  245.         {block:IndexPage}font-size: 22px;{/block:IndexPage}
  246.         font-weight: bold;
  247.         {block:PermalinkPage}text-align: center;{/block:PermalinkPage}
  248.     }
  249.    
  250.     .post .text {
  251.         {block:IndexPage}font-size: 13px;{/block:IndexPage}
  252.         {block:PermalinkPage}font-size: 15px;{/block:PermalinkPage}
  253.         width: 100%;
  254.     }
  255.  
  256.     .post .text img {
  257.         max-width: 100%;
  258.         height: auto;
  259.     }
  260.  
  261.     .post .question {
  262.         {block:IndexPage}font-size: 18px;{/block:IndexPage}
  263.         {block:PermalinkPage}font-size: 24px;{/block:PermalinkPage}
  264.         font-weight: 800;
  265.         background: white;
  266.         color: black;
  267.         padding: 10px;
  268.     }
  269.    
  270.     .post .answer {
  271.         border: solid 2px white;
  272.         padding: 10px;
  273.         width: calc(100% - 40px);
  274.         margin: 10px;
  275.     }
  276.  
  277.     blockquote {
  278.         margin: 0px 0px 0px 4px;
  279.         padding: 0px 0px 0px 8px;
  280.         border-left: solid 1px white;
  281.     }
  282.    
  283.     .post-info {
  284.         border-top: solid 2px white;
  285.         padding: 5px;
  286.         font-size: 11px;
  287.         height: auto;
  288.         margin: 0px -10px -10px -10px;
  289.         text-align: right;
  290.     }
  291.    
  292.     .tumblr_audio_player {
  293.         width: 300px;
  294.     }
  295.    
  296.     .spotify_audio_player {
  297.         height: 80px!important;
  298.         width: 300px;
  299.     }
  300.    
  301.     #postnotes {
  302.         font-size: 12px;
  303.         line-height: 24px;
  304.     }
  305.  
  306.     #postnotes ol.notes {
  307.         padding: 0px;
  308.         margin: 25px 0px;
  309.         list-style-type: none;
  310.         border-bottom: solid 1px #fff;
  311.     }
  312.  
  313.     #postnotes ol.notes li.note {
  314.         border-top: solid 1px #fff;
  315.         padding: 5px 0px 0px;
  316.     }
  317.  
  318.     #postnotes ol.notes li.note img.avatar {
  319.         margin-right: 10px;
  320.         width: 20px;
  321.         height: 20px;
  322.         border: solid 1px white;
  323.         border-radius: 11px;
  324.     }
  325.  
  326.     #postnotes ol.notes li.note span.action {
  327.         font-weight: bold;
  328.     }
  329.  
  330.     #postnotes ol.notes li.note .answer_content {
  331.         font-weight: normal;
  332.     }
  333.    
  334.     .pagi-under-posts {
  335.         position: relative;
  336.         bottom: 5px;
  337.         left: calc(50% - 125px);
  338.         width: 250px;
  339.     }
  340.     .jump_page {
  341. padding: 4px 8px;
  342. border: 3px solid {color:Links};
  343. background-color: black;
  344. color: {color:Links};
  345. font-size:14px;
  346. text-decoration:none;
  347. display: inline-block;
  348. }
  349.  
  350. .jump_page:hover {
  351.     padding: 4px 8px;
  352. border: 3px solid {color:Links Hover};
  353. background-color: black;
  354. color: {color:Links Hover};
  355. font-size:14px;
  356. text-decoration:none;
  357. display: inline-block;
  358. }
  359.  
  360. .current_page{
  361. padding: 4px 8px;
  362. border: 3px solid {color:Bold Text};
  363. background-color: black;
  364. color: {color:Bold Text};
  365. font-size:14px;
  366. text-decoration:none;
  367. display: inline-block;
  368. }
  369.    
  370.  
  371. .tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop {
  372.     position: fixed;
  373.     top: 0px;
  374.     right: 0px;
  375.     z-index: 9999999999999999;
  376. }  
  377.  
  378. #th-cred {
  379.     position: fixed;
  380.     bottom: 10px;
  381.     right: 15px;
  382.     color: black;
  383.     font-weight: 600;
  384.     font-size: 36px;
  385.     z-index: 99999999999999;
  386.     display: block;
  387. }
  388.  
  389. #th-cred:hover {
  390.     text-decoration: none;
  391.     color: white;
  392. }
  393.  
  394.  
  395.     {CustomCSS}
  396.  
  397. </style>
  398.  
  399.  
  400. </head>
  401. <body>
  402.  
  403. <div class="top" align="center">
  404.     <img src="{PortraitURL-128}" />
  405.     <a href="/">Home</a>
  406.     <a href="/archive">Archive</a>
  407.     {block:IfShowAskLink}{block:AskEnabled}<a href="/ask">{AskLabel}</a>{/block:AskEnabled}{/block:IfShowAskLink}
  408.     {block:HasPages}{block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}{/block:HasPages}
  409.     {block:IfLink1}<a href="{text:Link 1 URL}">{text:Link 1 Title}</a>{/block:IfLink1}
  410.     {block:IfLink2}<a href="{text:Link 2 URL}">{text:Link 2 Title}</a>{/block:IfLink2}
  411.     {block:IfLink3}<a href="{text:Link 3 URL}">{text:Link 3 Title}</a>{/block:IfLink3}
  412.     {block:IfLink4}<a href="{text:Link 4 URL}">{text:Link 4 Title}</a>{/block:IfLink4}
  413.     {block:IfLink5}<a href="{text:Link 5 URL}">{text:Link 5 Title}</a>{/block:IfLink5}
  414.     {block:IfLink6}<a href="{text:Link 6 URL}">{text:Link 6 Title}</a>{/block:IfLink6}
  415. </div>
  416.  
  417.  
  418. <div class="sidebar" align="center">
  419.    
  420.     <h1>{Title}</h1>
  421.     <img src="{image:Sidebar Image}" />
  422.     <div class="desc">
  423.         {Description}
  424.     </div>
  425.    
  426.     <h3><a href="/">REFRESH</a></h3>
  427.    
  428.     {block:IfNotPaginationUnderPosts}<div class="pagi-in-sidebar">
  429.     {block:PreviousPage}<a href="{PreviousPage}">Back</a>&#8195;{/block:PreviousPage}{CurrentPage} of {TotalPages}{block:NextPage}&#8195;<a href="{NextPage}">Next</a>{/block:NextPage}</div>{/block:IfNotPaginationUnderPosts}
  430.    
  431. </div>
  432.  
  433.         <div id="post-content">
  434.         {block:Posts}
  435.         <div class="post">
  436.            
  437.             {block:Text}
  438.                 {block:Title}
  439.                     <div class="title">{Title}</div>
  440.                 {/block:Title}
  441.                
  442.                 <div class="text">{Body}</div>        
  443.             {/block:Text}
  444.  
  445.             {block:Photo}
  446.                 <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  447.  
  448.                 {block:Caption}
  449.                     <div class="text">{Caption}</div>
  450.                 {/block:Caption}
  451.             {/block:Photo}
  452.  
  453.             {block:Photoset}
  454.                 <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  455.  
  456.                 {block:Caption}
  457.                     <div class="text">{Caption}</div>
  458.                 {/block:Caption}
  459.             {/block:Photoset}
  460.  
  461.             {block:Quote}
  462.                 <div class="title">"{Quote}"</div>
  463.  
  464.                 {block:Source}
  465.                     <div class="text">{Source}</div>
  466.                 {/block:Source}
  467.             {/block:Quote}
  468.  
  469.             {block:Link}
  470.                 <a href="{URL}" class="title" {Target}>{Name}</a>
  471.  
  472.                 {block:Description}
  473.                     <div class="text">{Description}</div>
  474.                 {/block:Description}
  475.             {/block:Link}
  476.  
  477.             {block:Chat}
  478.                 {block:Title}
  479.                     <div class="title">{Title}</div>
  480.                 {/block:Title}
  481.                
  482.                 {block:Lines}
  483.                 <div class="text">
  484.                 {block:Label}<strong>{Label} </strong>{/block:Label}{Line}
  485.                 </div>
  486.                 {/block:Lines}
  487.             {/block:Chat}
  488.            
  489.             {block:Answer}
  490.             <div class="question" align="right"><p>{Question}</p><p>~{Asker}</p></div>
  491.         {block:Answerer}
  492.             <div class="answer"><p><strong>{Answerer} replied:</strong></p><p>{Answer}</p></div>
  493.         {/block:Answerer}
  494.         {block:NotReblog}<div class="answer">{Answer}</div>{/block:NotReblog}
  495.         {block:RebloggedFrom}<div class="text">{Replies}</div>{/block:RebloggedFrom}
  496.         {/block:Answer}
  497.  
  498.             {block:Video}
  499.                 <div class="video">{Video-500}</div>
  500.  
  501.                 {block:Caption}
  502.                     <div class="text">{Caption}</div>
  503.                 {/block:Caption}
  504.             {/block:Video}
  505.  
  506.             {block:Audio}
  507.                 {block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}
  508.                 {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  509.             {/block:Audio}
  510.            
  511.                 <div class="post-info">
  512.             {block:Date}<a href="{Permalink}">{MonthNumber}/{DayOfMonth}/{Year}</a>{/block:Date}&#8195;{block:NoteCount}+<a href="{Permalink}#postnotes">{NoteCount}</a>{/block:NoteCount}&#8195;<a href="{ReblogURL}">reblog</a><br />
  513.             {block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}{/block:hasTags}
  514.             </div>
  515.            
  516.             {block:PermalinkPage}
  517.                 {block:PostNotes}
  518.                     <div id="postnotes">
  519.                             {PostNotes-64}
  520.                     </div>
  521.                 {/block:PostNotes}
  522.             {/block:PermalinkPage}
  523.         </div>
  524.     {/block:Posts}
  525.         </div>
  526.         {block:IfPaginationUnderPosts}<div class="pagi-under-posts" align="center">
  527.     {block:Pagination}
  528. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  529. {block:JumpPagination length="5"}
  530. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  531. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  532. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  533. {/block:Pagination}
  534. </div>{/block:IfPaginationUnderPosts}
  535. </div>
  536.  
  537.    
  538. </div>
  539.  
  540.  
  541. <script>
  542.     // minimal soundcloud player © shythemes.tumblr
  543. $(document).ready(function(){
  544.    var color = '#000'; // color of play button (hex)
  545.    $('.soundcloud_audio_player').each(function(){
  546.        $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=false&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 116, width: '100%' });
  547.    });
  548.    $('.photo-slideshow').pxuPhotoset({
  549.        lightbox: true,
  550.        rounded: false,
  551.        gutter: '5px',
  552.        photoset: '.photo-slideshow',
  553.        photoWrap: '.photo-data',
  554.        photo: '.pxu-photo'
  555.    });
  556.    {block:IndexPage}
  557.    var $container = $('#post-content');
  558.    $container.masonry({ itemSelector: '.post' });
  559.    $container.imagesLoaded(function(){
  560.        $container.masonry();
  561.        $container.find('.post').animate({ opacity: 1, zIndex: 1 });
  562.    });
  563.    {/block:IndexPage}
  564. });
  565. </script>
  566.  
  567.  
  568. <a href="http://voicelessthemes.tumblr.com" id="th-cred">&#169;</a>
  569.  
  570. {block:ContentSource}
  571. <!– {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  572. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  573. {/block:SourceLogo}
  574. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} –>
  575. {/block:ContentSource}
  576.  
  577. </body>
  578. </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!