Advertisement
SeoulChan

Eargasm (Music Blog Theme)

May 27th, 2015
1,797
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Lua 14.31 KB | None | 0 0
  1. <!-----------------------------------------------------------------------
  2.  _         _             _    
  3. | | ____ _(_) __ _ _   _| | __
  4. | |/ / _` | |/ _` | | | | |/ /
  5. |   < (_| | | (_| | |_| |   <
  6. |_|\_\__,_|_|\__, |\__,_|_|\_\
  7.              |___/
  8. Eargasm theme by Anika (Ani) aka Kaiguk (http://kaiguk.tumblr.com/)
  9.  
  10. ***I highly recommend that you use this theme for music blogs w/audio post, but you can use it like any other theme, you just may have to change some things around.***
  11.  
  12. Please remember to follow the rules and not steal anything because you don't
  13. have an imagination of your own.
  14.  
  15. If anything goes wrong or you have any questions, just let me know!
  16.  
  17. Happy Using and Have a good day!
  18. ------------------------------------------------------------------------>
  19.  
  20. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  21.  
  22. <title>{Title}</title>
  23.  
  24. <link rel="shortcut icon" href="{Favicon}" />
  25.  
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27.  
  28. {block:Description}<meta name="description" content="{MetaDescription}" />
  29. {/block:Description}
  30.  
  31. <head>
  32.  
  33. <meta name="if:ShowCaptions" content="1"/>
  34. <meta name="if:ShowTags" content="1"/>
  35.  
  36. <meta name="color:Bold" content="#ff7d7d"/>
  37. <meta name="color:Italic" content="#c3d847"/>
  38. <meta name="color:Underline" content="#4dbce9"/>
  39. <meta name="color:Background" content="#ffffff"/>
  40. <meta name="color:Border" content="#cccccc"/>
  41. <meta name="color:Text" content="#aaaaaa"/>
  42. <meta name="color:Link" content="#cccccc"/>
  43. <meta name="color:Hover" content="#eeeeee"/>
  44. <meta name="color:Topbar" content="#000000"/>
  45. <meta name="color:Title" content="#eeeeee"/>
  46. <meta name="color:Icons" content="#222222"/>
  47. <meta name="color:Desc bg" content ="#000000"/>
  48. <meta name="color:Desc text" content ="#ffffff"/>
  49. <meta name="color:Post bg" content="#ffffff"/>
  50. <meta name="color:Caption Bg" content="#fbfbfb"/>
  51. <meta name="color:Caption Border" content="#f6f6f6"/>
  52. <meta name="color:Caption" content="#cccccc"/>
  53. <meta name="color:LinkTitleBG" content="#eeeeee"/>
  54. <meta name="color:LinkTitleText" content="#aaaaaa"/>
  55. <meta name="color:Selection text" content="#888888"/>
  56. <meta name="color:Selection bg" content="#eeeeee"/>
  57. <meta name="color:Scrollbar" content="#eeeeee"/>
  58.  
  59. <meta name="image:Sidebar Icon" content=""/>
  60. <meta name="image:Image 1" content=""/>
  61. <meta name="image:Image 2" content=""/>
  62. <meta name="image:Image 3" content=""/>
  63. <meta name="image:Image 4" content=""/>
  64. <meta name="image:Image 5" content=""/>
  65.  
  66. <meta name="image:Bg" content=""/>
  67.  
  68.  
  69. <meta name="text:Link 1 URL" content="" />
  70. <meta name="text:Link 1" content="" />
  71. <meta name="text:Link 2 URL" content="" />
  72. <meta name="text:Link 2" content="" />
  73. <meta name="text:Link 3 URL" content="" />
  74. <meta name="text:Link 3" content="" />
  75. <meta name="text:Link 4 URL" content="" />
  76. <meta name="text:Link 4" content="" />
  77.  
  78. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  79. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  80. <script>
  81. (function($){
  82. $(document).ready(function(){
  83. $("[title]").style_my_tooltips();
  84. });
  85. })(jQuery);
  86. </script>
  87.  
  88. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  89.  
  90.  
  91. <style type="text/css">
  92.  
  93. ::-webkit-scrollbar {width: 7px; height: 4px; background: #ffffff; }
  94. ::-webkit-scrollbar-thumb { background-color: {color:scrollbar};}
  95.  
  96.  
  97. body {
  98. background:{color:background};
  99. color:{color:text};
  100. background-attachment:fixed;
  101. background-image:url('{image:bg}');
  102. font-family:courier;
  103. font-size:9.5px;
  104. text-transform:uppercase;
  105. word-wrap: break-word;
  106. text-align: justify;margin:0;
  107. line-height:16px;
  108. }
  109.  
  110.  
  111. a {
  112. color:{color:link};
  113. text-decoration:none;
  114. -moz-transition-duration: 0.4s;
  115. -webkit-transition-duration: 0.4s;
  116. -o-transition-duration: 0.4s;
  117. }
  118.  
  119. a:hover {
  120. color:{color:hover};
  121. -moz-transition-duration: 0.4s;
  122. -webkit-transition-duration: 0.4s;
  123. -o-transition-duration: 0.4s;
  124. }
  125.  
  126. b,strong{
  127. color:{color:bold};
  128. }
  129.  
  130. i,em{
  131. color:{color:italic};
  132. }
  133.  
  134. u{
  135. color:{color:underline};
  136. }
  137.  
  138. blockquote {
  139. padding:5px 0 5px 30px;
  140. border-left:1px solid {color:link};
  141. margin-left:30px;
  142. }
  143.  
  144. #topbar {
  145. top:0px;
  146. left:0px;
  147. width:100%;
  148. height:60px;
  149. background:{color:topbar};
  150. padding:15px;
  151. z-index:1;
  152. position:fixed;
  153. }
  154.  
  155. #title{
  156. margin-top:25px;
  157. font-family: 'Rock Salt', cursive;font-size:50px;
  158. color:{color:title};
  159. position:fixed;
  160. }
  161.  
  162. #tophead {
  163. margin-top:100px;
  164. margin-left:-250px;
  165. margin-bottom:150px;
  166. position:absolute;
  167. }
  168.  
  169. #tophead img {
  170. width:1000px;
  171. height:600px;
  172. }
  173.  
  174. #sidebar {
  175. margin-left:300px;
  176. margin-top:730px;
  177. width:500px;
  178. position:absolute;
  179. }
  180.  
  181. #sidebarim {
  182. margin-bottom:20px;
  183. }
  184.  
  185. #sidebarim img {
  186. width:20px;
  187. height:20px;
  188. margin-top:30px;
  189. float:left;
  190. padding:5px;
  191. padding-left:5px;
  192. border-radius:10px;
  193. }
  194.  
  195. #desc {
  196. width:450px;    
  197. padding:10px;
  198. padding-left:5px;
  199. padding-right:5px;
  200. word-spacing:1px;
  201. letter-spacing:1px;
  202. font-size:9px;
  203. text-transform:uppercase;
  204. text-align:left;
  205. }
  206.  
  207. .desc {
  208. line-height:180%;
  209. background:{color:desc bg};
  210. color:{color:desc text};
  211. }
  212.  
  213. #icons{
  214. margin-left:-200px;
  215. margin-top:760px;
  216. position:absolute;
  217. }
  218.  
  219. #icons a {
  220. margin-left:50px;    
  221. }
  222.  
  223. #links {
  224. line-height:16px;
  225. margin-top:30px;
  226. margin-left:100px;
  227. padding-left:150px;
  228. }
  229.  
  230. #links a {
  231. font-size:20px;    
  232. margin-left:80px;
  233. text-transform:uppercase;
  234. text-align:center;
  235. }
  236.  
  237. #links a:hover{
  238. color:{color:hover};    
  239. }
  240.  
  241. #hold {
  242. left:50%;
  243. margin-left:-250px;
  244. position:absolute;
  245. }
  246.  
  247. #entries {
  248. margin-top:980px;
  249. width:500px;
  250. }
  251.  
  252. #posts {
  253. background:{color:post bg};
  254. border:1px solid {color:border};
  255. padding:20px;
  256. width:500px;
  257. margin-bottom:75px;
  258. margin-left:5px;
  259. }
  260.  
  261. #posts img {
  262. max-width:500px;
  263. }
  264.  
  265. #titlequote {
  266. text-align:left;
  267. font-size:14px;
  268. line-height:18px;
  269. font-weight:bold;
  270. }
  271.  
  272. #source {
  273. margin-top:15px;
  274. margin-left:15px;
  275. }
  276.  
  277. .question {
  278. margin-bottom:10px;
  279. font-style:italic;
  280. padding:3px;
  281. background-color:#F6F6F6;
  282. }
  283.  
  284. .answer {
  285. margin-top:10px;
  286. }
  287.  
  288. .chat ol {
  289. padding:0;
  290. list-style:none;
  291. }
  292.  
  293. .line {
  294. padding:5px 0;
  295. border-bottom:1px solid {color:border};
  296. }
  297.  
  298. {block:IfShowCaptions}
  299. #captions {
  300. margin-top: 10px;
  301. padding:5px;
  302. text-align:left;
  303. background: {color:Caption bg};
  304. border: 1px solid {color:Caption border};
  305. color:{color:Caption};
  306. }
  307. {/block:IfShowCaptions}
  308.  
  309. {block:IfNotShowCaptions}
  310. #captions {
  311. display:none;
  312. }
  313. {/block:IfNotShowCaptions}
  314.  
  315. {block:IfShowTags}
  316. #tags{
  317. text-align:right;
  318. color:{color:text};
  319. word-spacing:2px;
  320. font-style:italic;
  321. }
  322.  
  323. #tags a{
  324. margin-left:10px;    
  325. }
  326. {/block:IfShowTags}
  327.  
  328. {block:IfNotShowTags}
  329. #tags{
  330. display:none;
  331. }
  332. {block:IfNotShowTags}
  333.  
  334. .info {
  335. margin-top:20px;  
  336. margin-bottom:10px;
  337. color:{color:link};
  338. text-transform:normal;
  339. font-style:normal;
  340. letter-spacing:2px;
  341. background:#F4F4F4;
  342. -moz-transition-duration:0.5s;
  343. -webkit-transition-duration:0.5s;
  344. -o-transition-duration:0.5s;
  345. }
  346.  
  347. .info a{
  348. margin-left:60px;    
  349. }
  350. .note li {
  351. list-style-type:none;
  352. padding:10px 25px 10px 25px;
  353. text-align:left;
  354. margin:0px;
  355. border-bottom:1px solid {color:border};
  356. -moz-transition-duration:0.5s;
  357. -webkit-transition-duration:0.5s;
  358. -o-transition-duration:0.5s;
  359. }
  360.  
  361. .notes img {
  362. display:none!important;
  363. }
  364.  
  365. #who {
  366. position:fixed;
  367. left:10px;
  368. bottom:10px;
  369. text-transform:uppercase;
  370. font-size:15px;
  371. letter-spacing:1px;
  372. padding:5px;
  373. -webkit-transition: all 0.3s ease;
  374. -moz-transition: all 0.3s ease;
  375. -ms-transition: all 0.3s ease;
  376. -o-transition: all 0.3s ease;
  377. transition: all 0.3s ease;
  378. }
  379.  
  380. #s-m-t-tooltip {
  381. z-index: 9999;
  382. background: {color:LinkTitleBG};
  383. font-size: 10px;
  384. line-height: 11px;
  385. border:1px solid {color:LinkTitleText};
  386. letter-spacing: 1px;
  387. text-transform: normal;
  388. color: {color:LinkTitleText};
  389. max-width: 150px;
  390. word-wrap: break-word;
  391. padding: 5px;
  392. margin-left:20px;
  393. display: block;
  394. }
  395.  
  396. ::selection {
  397. background:{color:selection bg};
  398. color:{color:selection text};
  399. }
  400.  
  401. #perma {
  402. padding:10px;
  403. width:474px;
  404. text-align:justify;
  405. line-height:15px;
  406. margin-top:10px;
  407. height:auto;
  408. }
  409.  
  410. #scrollToTop:link, #scrollToTop:visited {
  411. display:none;
  412. position:fixed;
  413. bottom: 10px;
  414. right:10px;
  415. }
  416.  
  417. {CustomCSS}
  418.  
  419. </style>
  420.  
  421. <link href='http://fonts.googleapis.com/css?family=Rock+Salt' rel='stylesheet' type='text/css'>
  422.  
  423. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/EIBmz7s0p/infinitescrolling.js"></script>
  424.  
  425. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  426. <script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  427.  
  428. <a href="javascript:;" id="scrollToTop"  title="top"><i style="color:{color:link};"class="fa fa-level-up fa-3x"></i></a>
  429.  
  430. </head>
  431.  
  432. <body>
  433.  
  434. <div id="hold">
  435.  
  436. <div id="tophead">
  437.  
  438. <div id="topheadimg">
  439.  
  440. <script language="JavaScript">
  441. <!--
  442.  
  443. /*
  444. Random Image Script- By JavaScript Kit (http://www.javascriptkit.com)
  445. Over 400+ free JavaScripts here!
  446. Keep this notice intact please
  447. */
  448.  
  449. function random_imglink(){
  450. var myimages=new Array()
  451. //specify random images below. You can have as many as you wish
  452. myimages[1]="{image:Image 1}"
  453. myimages[2]="{image:Image 2}"
  454. myimages[3]="{image:Image 3}"
  455. myimages[4]="{image:Image 4}"
  456. myimages[5]="{image:Image 5}"
  457.  
  458. var ry=Math.floor(Math.random()*myimages.length)
  459. if (ry==0)
  460. ry=1
  461. document.write('<img src="'+myimages[ry]+'" border=0>')
  462. }
  463. random_imglink()
  464. //-->
  465. </script>
  466.  
  467. </div>
  468.    
  469. </div>
  470.  
  471. <div id="sidebar">
  472.  
  473. <div id="sidebarim"><img src="{image:Sidebar Icon}"></div>
  474.  
  475. <div id="desc"><span class="desc">{Description}</span></div>
  476.  
  477. <div id="topbar">
  478.  
  479. <div id="title">{Title}</div>
  480.  
  481. <div id="links">
  482. <a href="/">Home</a>
  483. <a href="/ask">Inbox</a>
  484. <a href="/archive">Archive</a>
  485. </div>  
  486.  
  487. </div>
  488.  
  489. </div>
  490.  
  491. <div id="icons">
  492. {block:ifLink1}<a href="{text:Link 1 URL}"><i style="color:{color:icons};"title="{text:Link 1}"class="fa fa-music fa-4x"></i></a>{/block:ifLink1}
  493. {block:ifLink2}<a href="{text:Link 2 URL}"><i style="color:{color:icons};"title="{text:Link 2}"class="fa fa-headphones fa-4x"></i></a>{/block:ifLink2}
  494. {block:ifLink3}<a href="{text:Link 3 URL}"><i style="color:{color:icons};"title="{text:Link 3}"class="fa fa-users fa-4x"></i></a>{/block:ifLink3}
  495. {block:ifLink4}<a href="{text:Link 4 URL}"><i style="color:{color:icons};"title="{text:Link 4}"class="fa fa-plus fa-4x"></i></a>{/block:ifLink4}
  496. </div>
  497.  
  498. <div id="entries">
  499.  
  500. <div class="autopagerize_page_element">
  501.  
  502. {block:Posts}
  503.  
  504. <div id="posts">
  505.  
  506. {block:Quote}
  507. <div id="titlequote">“{Quote}”</div>
  508. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  509. {/block:Quote}
  510.  
  511.  
  512. {block:Text}
  513. {block:Title}<div style="font-size:20px;" id="title">{Title}</div>{/block:Title}{Body}
  514. {/block:Text}
  515.  
  516. {block:Link}
  517. <div style="font-size:20px;"id="title"><a href="{URL}">{Name}
  518. <i style=" color:{color:link};"class="fa fa-arrow-right"></i></a></div>
  519. {block:Description}{Description}{/block:Description}
  520. {/block:Link}
  521.  
  522. {block:Chat}
  523. {block:Title}<h1>{Title}</h1>{/block:Title}<div class="chat"><ol>{block:Lines}<li class="line {Alt}">{block:Label}<span class="label"><b>{Label}</b></span>{/block:Label}{Line}</li>{/block:Lines}</ol></div>
  524. {/block:Chat}
  525.  
  526. {block:Photo}
  527. <a href="{Permalink}">
  528. <center><img src="{PhotoURL-500}" alt="{PhotoAlt}"/</a></center>
  529. {block:IndexPage}{block:Caption}<div id="captions">{Caption}</div>{/block:Caption}{/block:IndexPage}
  530. {/block:Photo}
  531.  
  532. {block:Photoset}
  533. <center>{Photoset-500}</center>{block:IndexPage}{block:Caption}
  534. <div id="captions">{Caption}</div>{/block:Caption}{/block:IndexPage}
  535. {/block:Photoset}
  536.  
  537. {block:Video}
  538. {Video-500}
  539. {/block:Video}
  540.  
  541. {block:Audio}
  542. {block:AlbumArt}<img src="{AlbumArtURL}" width="100px" align="left" style="margin-right:10px;float:left;background:#E4E4E4; padding:5px;    border-radius: 10px 30px; "/>
  543. {/block:AlbumArt}
  544. <span class="audio">{AudioPlayerGrey}</span>
  545. {block:TrackName}<p><b> Title:</b> {TrackName}{/block:TrackName}
  546. {block:Artist}<p><b> Artist:</b> {Artist}{/block:Artist}
  547. <p><b>Played:</b> {PlayCount} times
  548. {/block:Audio}
  549.  
  550. {block:Answer}
  551. <div class="ask"><img src="http://33.media.tumblr.com/72847c3286351b1e436aa96deca72184/tumblr_inline_n5sqjycHms1sbfysw.gif">
  552. {Asker} whispered:</div><p>
  553. <div class="question">
  554. {Question}</div>
  555. <div class="answer">{Answer}</div>
  556. {/block:Answer}
  557.  
  558. {block:Indexpage}
  559. <div class="info"><a href="{Permalink}">{TimeAgo}</a>  <a href="{Permalink}">{NoteCountWithLabel}</a>      <a href="{ReblogURL}">Reblog</a>
  560. </div>
  561.  
  562. {block:IfShowTags}<div id="tags">{block:HasTags}
  563. <img src="http://static.tumblr.com/3yblkz0/9mQn46s61/untitled-2.png"> Music tags:{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}{/block:HasTags}</div>
  564. {/block:IfShowTags}
  565.  
  566. {/block:IndexPage}
  567.  
  568. {block:PermalinkPage}
  569. {block:Date}
  570. <div id="perma">
  571. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}<br>
  572. <img src="http://static.tumblr.com/3yblkz0/bWKn2c3l1/plan.png">
  573. <b>Date:</b> {ShortMonth} {DayOfMonthWithZero}, {Year}<br>
  574. {block:NoteCount}
  575. <img src="http://media.tumblr.com/9395b2e212e1433fceeb8f2fe727e88e/tumblr_inline_n2ajerV2ro1r7v6wt.png">
  576. <b>Notes:</b> {NoteCount}<br>
  577. {/block:NoteCount}
  578. {block:RebloggedFrom}
  579. <img src="http://static.tumblr.com/3yblkz0/Eifn2c23d/w2.png">
  580. <b>Via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  581. {/block:RebloggedFrom}
  582. {block:ContentSource}
  583. <img src="http://static.tumblr.com/3yblkz0/Eifn2c23d/w2.png">
  584. <b>Source:</b> <a href="{SourceURL}">{SourceTitle}</a><br>
  585. {/block:ContentSource}
  586. {block:HasTags}
  587. <img src="http://static.tumblr.com/3yblkz0/wfTn2c29g/tag.png">
  588. <b>Tagged under:</b>
  589. {block:Tags}
  590. <a href="{TagURL}">#{Tag}</a>
  591. {/block:Tags}
  592. {/block:HasTags}
  593. </div>
  594. {/block:Date}
  595. <div class="note">
  596. {block:PostNotes}{PostNotes}{/block:PostNotes}
  597. </div>
  598. {/block:PermalinkPage}
  599. </div>
  600.  
  601. {/block:Posts}
  602.  
  603. </div>
  604.  
  605. </div>
  606.  
  607. {block:ContentSource}
  608. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  609. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  610. {/block:SourceLogo}
  611. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  612. {/block:ContentSource}
  613.  
  614. </div>
  615.  
  616. <div id="who">
  617.  
  618. <a href="http://kaiguk.tumblr.com/" title="theme by Ani">KG</a>
  619.  
  620. </div>
  621.  
  622. </body>
  623.  
  624. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement