API tools faq
paste
dendysoft

TRIPLE BAKA tumblr theme by @dendysoft

dendysoft
Nov 18th, 2022
589
0
Never
1
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 11.66 KB | Source Code | 0 0
raw download clone embed print report
  1. <html>
  2. <!---
  3. base code by @ps1
  4. --->
  5.  
  6. <!---
  7. TRIPLE BAKA theme by by @dendysoft
  8. --->
  9.  
  10. <head>
  11.        
  12. <title>{Title}</title>
  13.         <link rel="icon" href="{image:FavIcon}" type="image/gif" >
  14.         <link rel="alternate" type="application/rss+xml" href="{RSS}">
  15.         {block:Description}
  16.             <meta name="description" content="{MetaDescription}" />
  17.         {/block:Description}
  18.  
  19. <!--- Add Custom Fonts Here (like Google Fonts) --->
  20.  
  21.  
  22. <!--- Then add Font name to the 'Font Family' in Theme Options Area --->
  23.  
  24. <meta name="image:favicon" content=""/>  
  25. <meta name="image:sidebar" content=""/>
  26. <meta name="image:background" content=""/>
  27. <meta name="image:floatie 1" contents="" />
  28. <meta name="image:floatie 2" contents="" />
  29. <meta name="image:floatie 3" contents="" />
  30.  
  31. <meta name="color:background" content="#fff">
  32. <meta name="color:posts" content="#ff6">
  33. <meta name="color:font color" content="#0a9">
  34. <meta name="color:links" content="#c06">
  35. <meta name="color:links hover" content="0a9">
  36. <meta name="color:border" content="#c06">
  37.  
  38. <meta name="select:links hover" content="none"/>
  39. <meta name="select:links hover" content="underline"/>
  40. <meta name="select:links hover" content="overline"/>
  41. <meta name="select:links hover" content="line-through"/>
  42.  
  43. <meta name="text:border size" content="4"/>
  44.  
  45. <meta name="text:font family" content="arial">
  46.  
  47. <meta name="if:tile background" content="0" />
  48. <meta name="if:transparent posts" content="0" />
  49.  
  50. <meta name="text:link spacer" content="&times;">
  51. <meta name="text:link 1" content="ONE">
  52. <meta name="text:link 1 URL" content="/">
  53. <meta name="text:link 2" content="TWO">
  54. <meta name="text:link 2 URL" content="/">
  55. <meta name="text:link 3" content="THREE">
  56. <meta name="text:link 3 URL" content="/">
  57.  
  58. <style type="text/css">
  59. ::-moz-selection {
  60.     background: {color:background};
  61.     color: {color:links hover};}
  62.    
  63. ::selection {
  64.     background: {color:background};
  65.     color: {color:links};}
  66.  
  67.  
  68. body {
  69.     background: {color:background};
  70.     background-image: url({image:Background});
  71.     background-attachment: fixed;
  72.     {block:IfNotTileBackground}
  73.     -webkit-background-size: cover;
  74.     -moz-background-size: cover;
  75.     -o-background-size: cover;
  76.     background-size: cover;
  77.     {/block:IfNotTileBackground}
  78.     font-family: {text:font family};
  79.     font-size: 14px;
  80.     color: {color:font color};
  81.     line-height: 120%;
  82.     word-wrap: break-word;
  83.     overflow-x:hidden;}
  84.    
  85. p {margin: 10px;}
  86. ul {list-style: square;}
  87. img {max-width: 100%;}
  88. h1 {line-height: 150%;}
  89.  
  90. a:link, a:active, a:visited {
  91.     color: {color:links};
  92.     {block:IfNotLinksUnderline}
  93.     text-decoration: none;{/block:IfNotLinksUnderline}
  94.     {block:IfLinksUnderline}
  95.     text-decoration: underline;{/block:IfLinksUnderline}
  96.     -webkit-transition: all 0.2s ease-in-out;
  97.     -moz-transition: all 0.2s ease-in-out;
  98.     -o-transition: all 0.2s ease-in-out;
  99.     -ms-transition: all 0.2s ease-in-out;
  100.     transition: all 0.2s ease-in-out;}
  101.  
  102. a:hover {
  103.     color: {color:Links Hover};
  104.     text-decoration: {select:links hover};
  105.     -webkit-transition: all 0.2s ease-in-out;
  106.     -moz-transition: all 0.2s ease-in-out;
  107.     -o-transition: all 0.2s ease-in-out;
  108.     -ms-transition: all 0.2s ease-in-out;
  109.     transition: all 0.2s ease-in-out;}
  110.  
  111. ::-webkit-scrollbar-track {
  112.     border: 0;
  113.     background-color: {color:Background};}
  114. ::-webkit-scrollbar {
  115.     width: 10px;}
  116. ::-webkit-scrollbar-thumb {
  117.     background-color: {color:links};}
  118.  
  119. /* the container of both your sidebar and posts */
  120.  
  121. #content {
  122.     margin: 10px 10px 10px 50px;
  123.     width: 850px;}
  124.  
  125. /* sidebar style obvi */
  126.  
  127. #sidebar {
  128.     color: {color:font color};
  129.     {block:IfNotTransparentPosts}
  130.     background-color: {color:posts};{/block:IfNotTransparentPosts}
  131.     {block:IfTransparentPosts}
  132.     background-color: transparent;{/block:IfTransparentPosts}
  133.     border: {text:border size}px double {color:border};
  134.     text-align: center;
  135.     margin-left: -50px;
  136.     margin-top: 40px;
  137.     position: fixed;
  138.     padding: 10px;
  139.     width: 200px;}
  140.  
  141. #sidebar img {max-width:100%;}
  142. .desc, .linkz {margin-top: 10px;}
  143. .title {margin-bottom: 5px;}
  144.  
  145. /* post style obvi */
  146.  
  147. .posts {
  148.     {block:IfNotTransparentPosts}
  149.     background-color: {color:posts};{/block:IfNotTransparentPosts}
  150.     {block:IfTransparentPosts}
  151.     background-color: transparent;{/block:IfTransparentPosts}
  152.     border: {text:border size}px double {color:border};
  153.     margin-top: 0px;
  154.     margin-bottom: 80px;
  155.     margin-left: 200px;
  156.     padding: 10px 0px 0px 0px;
  157.     width: 400px;
  158.     position: relative;}
  159.  
  160. .posts blockquote {
  161.     margin: 10px;
  162.     padding-left: 5px;
  163.     border-left: 1px double {color:links};}
  164.  
  165. /* footer of every post */
  166.  
  167. #notes, .tags{
  168.     text-align: center;
  169.     margin-top: 5px;}
  170.    
  171. #notes img {display: inline;}
  172.  
  173. /* stylize your asks */
  174.  
  175. .question {
  176.     padding: 5px; margin-top: 10px;
  177.     border: 1px solid {color:font color};}
  178.  
  179. /* where the notes show on the permalink page */
  180.  
  181. #permanotes {
  182.     margin-top: 20px;
  183.     margin-bottom: 10px;}
  184.    
  185. #permanotes ol.notes {
  186.     list-style-type: none;
  187.     margin: 0;
  188.     padding: 0;}
  189.    
  190. #permanotes img.avatar {
  191.     margin-right: 10px;
  192.     border: 1px solid {color:font color};
  193.     display: inline;
  194.     width: 16px;
  195.     height: 16px;}
  196.  
  197. /* next page/previous page */
  198.  
  199. .pagination {
  200.     text-align: right;
  201.     font-size: 50px;
  202.     margin-left: 300px;
  203.     margin-top: -50px;
  204.     margin-bottom: 100px;
  205.     padding: 10px;
  206.     width: 400px;}
  207.  
  208. /* quote stylization */
  209.  
  210. .quote {
  211.     text-align: justify;
  212.     font-style: italic;
  213.     font-weight: bold;
  214.     font-size: 140%;
  215.     line-height: 130%;}
  216.  
  217. .source {
  218.     text-align: right;}
  219.  
  220. /* audio stuff */
  221.  
  222. .spotify_audio_player {
  223.     height:80px!important;
  224.     width:100%!important;}
  225.    
  226. .soundcloud_audio_player {
  227.     height:150px!important;
  228.     width:100%!important;}
  229.    
  230. /* video stuff, @cod helped me figure part of this out :) */
  231.  
  232. .videowrapper {
  233. position: relative; display:inline-block; width:400px!important;}
  234.  
  235. iframe, img, embed, object, video {
  236.  
  237. max-width: 100%;
  238. }
  239.  
  240. /* playbutton background */
  241.  
  242. .trackback {
  243.     position: absolute;
  244.     left: 20px;
  245.     top: 20px;
  246.     width: 19px;
  247.     height: 19px;
  248.     background-color: #fff;
  249.     padding: 10px;
  250.     opacity: .4;}
  251.  
  252. /* playbutton */
  253.  
  254. .pressplay{
  255.     position: relative;
  256.     width: 25px;
  257.     height: 25px;
  258.     overflow: hidden;
  259.     left: -6px;
  260.     top: -3px;}
  261.  
  262. /* album img container */
  263.  
  264. .albumpic {
  265.     position: absolute;
  266.     left: 0px;
  267.     top: 0px;
  268.     width: 79px;
  269.     height: 79px;}
  270.  
  271. /* album img */
  272.  
  273. .albumpic img {
  274.     width: 100%;
  275.     height: auto;
  276.     border: 1px solid {color:font color};}
  277.    
  278. /* track info ye */
  279.            
  280. .trackinfo {
  281.     width: auto;
  282.     display:inline-block;
  283.     margin-left: 90px;
  284.     min-height: 85px;}
  285.  
  286. /* makes both audio player & track info inline */
  287.  
  288. .audiowrapper {
  289. position: relative; display:inline-block; max-width:380px; object-fit: contain; }
  290.  
  291. /* video stuff */
  292.  
  293. .media {
  294.     position: relative;
  295.     padding-bottom: 56.25%;
  296.     height: 0;
  297. }
  298.  
  299. .media iframe{
  300.     position: absolute;
  301.     width: 100%;
  302.     height: 100%;
  303.     left: 0;
  304.     top: 0;
  305. }
  306.  
  307.  
  308.  
  309. /* base code by @ps1 */
  310.  
  311.  
  312. </style>
  313.  
  314. <!-- search tags -->
  315. <script>
  316. $(document).ready(function(){
  317.    $('.search').submit(function(event){
  318.        var value = $('input:first').val();
  319.        location.replace('http://{Name}.tumblr.com/tagged/' + value);
  320.    });
  321. });
  322. </script>
  323.  
  324. </head>  
  325.  
  326. <body>
  327.  
  328. <div id="content">
  329.  
  330. <div id="floaties">
  331.  
  332. <img src="{image:floatie 1}" style="max-width: 200px; margin-top: 300px; margin-left: -30px; position: fixed; z-index: 9999;">
  333.  
  334. <img src="{image:floatie 2}" style="max-width: 200px; margin-top: 300px; margin-left: 700px; position: fixed; z-index: 9999;">
  335.  
  336. <img src="{image:floatie 3}" style="max-width: 200px; margin-top: 10px; margin-left: 625px; position: fixed; z-index: 9999;">
  337.  
  338. </div>
  339.  
  340. <div id="sidebar">
  341.  
  342. <a href="/"><img src="{image:sidebar}" style:"max-height:200px"></a>
  343.  
  344. <div class="linkz">
  345. <a href="{text:link 1 URL}">{text:link 1}</a>
  346. <a href="https://triplebakatheme.tumblr.com" style="text-decoration:none">{text:link spacer}</a>
  347. <a href="{text:link 2 URL}">{text:link 2}</a>
  348. <a href="https://ps1.tumblr.com/post/616166839615176704/base-code-by-ps1-preview-code-a-simple-sidebar" style="text-decoration:none">{text:link spacer}</a>
  349. <a href="{text:link 3 URL}">{text:link 3}</a>
  350. </div>
  351.  
  352. <div class="desc">{description}</div>
  353.  
  354. </div>
  355.  
  356. {block:Posts}
  357. <div class="posts">
  358.  
  359. {block:Text}
  360. {block:Title}<a href="{Permalink}">{Title}</a>{/block:Title}
  361. {Body}
  362. {/block:Text}
  363.  
  364. {block:Quote}
  365. <div class="quote">"{Quote}"</div>
  366. {block:Source}<div class="source">&mdash; {Source}</div>{/block:Source}
  367. {/block:Quote}
  368.  
  369. {block:Link}
  370. <big><a href="{URL}">{Name}</a></big>
  371. {block:Description}{Description}{/block:Description}
  372. {/block:Link}
  373.  
  374. {block:Chat}
  375. {block:Title}{Title}{/block:Title}
  376. {block:Lines}
  377. <div class="{Alt} user_{UserNumber}">
  378. {block:Label}{Label}{/block:Label} {Line}
  379. </div>
  380. {/block:Lines}
  381. {/block:Chat}
  382.  
  383.  
  384. {block:Answer}
  385. {Asker}
  386. <div class="question">{Question}</div>
  387. {Answer}
  388. {/block:Answer}
  389.  
  390.  
  391. {block:Photo}
  392. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{Permalink}"/>{LinkCloseTag}
  393. {/block:Photo}
  394.  
  395. {block:Photoset}
  396. {Photoset-400}
  397. {/block:Photoset}
  398.  
  399. {block:Video}
  400. <div class="media">{Video-400} {VideoEmbed-400}</div>
  401. {/block:Video}
  402.  
  403. {block:AudioPlayer}
  404. <div class="audiowrapper">
  405. {block:AlbumArt}
  406. <div class="albumpic"><img src="{AlbumArtURL}"></div>
  407. {/block:AlbumArt}
  408. <div class="trackback">
  409. <div class="pressplay">
  410. {AudioPlayer}
  411. </div></div>
  412. <div class="trackinfo">
  413. {block:TrackName}{TrackName}{/block:TrackName}<br>
  414. {block:Artist}<b>{Artist}</b>{/block:Artist}<br>
  415. {block:Album}<i>{Album}</i>{/block:Album}<br>
  416. </div></div>
  417. {/block:AudioPlayer}
  418.    
  419. {block:Caption}{Caption}{/block:Caption}
  420.  
  421. {block:IndexPage}<div id="notes">
  422. <a href="{Permalink}" data-toggle="tooltip" title="{TimeAgo}">{12Hour}:{Minutes}</a>
  423. {text:link spacer}
  424. <a href="{ReblogURL}" data-toggle="tooltip" title="Reblog?">{NoteCount}</a>
  425. </div>{/block:IndexPage}
  426.  
  427. {block:IndexPage}
  428. <div class="tags">
  429. {block:HasTags}{block:Tags}
  430. <a href="{TagURL}">#{Tag}</a>
  431. {/block:Tags}{/block:HasTags}</div>{/block:IndexPage}
  432.  
  433.  
  434. {block:PermalinkPage}
  435. {block:Caption}{Caption}{/block:Caption}
  436.  
  437. <p>{block:NoteCount}Notes: <a href="{Permalink}">{NoteCount}</a><br>{/block:NoteCount}
  438. {block:HasTags}Tags: {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}<br>{/block:HasTags}
  439. {block:RebloggedFrom}
  440. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  441. <br>{/block:RebloggedFrom}{block:ContentSource}
  442. Source: <a href="{SourceURL}">{SourceTitle}</a>
  443. {/block:ContentSource}</p>
  444.  
  445. {block:NoteCount}<div id="permanotes">
  446. {block:PostNotes}{PostNotes}{/block:PostNotes}
  447. </div>{/block:NoteCount}
  448. {/block:PermalinkPage}
  449. </div>
  450. {/block:Posts}
  451.  
  452. {block:IndexPage}<div class="pagination">    
  453. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}" style="float:left;">&larr;</a>&nbsp;&nbsp;{/block:PreviousPage}{block:NextPage}
  454.  <a href="{NextPage}">&rarr;</a></p>{/block:NextPage}{/block:Pagination}
  455. </div>{/block:IndexPage}
  456.  
  457. </div>
  458. </div>
  459.  
  460. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  461. <script>
  462. $(document).ready(function(){
  463.    $('.videocontainer iframe').each(function(){
  464.        var scale = $(this).parents('.videocontainer').width() / 500;
  465.        $(this).attr({
  466.            width: Math.floor($(this).attr('width') * scale),
  467.            height: Math.floor($(this).attr('height') * scale)
  468.        });
  469.    });
  470. });
  471. </script>
  472.  
  473. </body>
  474. </html>
  475.  
  476.  
Tags: tumblr Tumblr Themes tumblr theme tumblr theme with floaties tumblr themes with floaties tumblr layout tumblr layouts
Advertisement
Comments
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!