API tools faq
paste
Advertisement
lexaofrp

THEME 14: BASICS

lexaofrp
Nov 11th, 2014
1,720
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.27 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3.  
  4.  
  5.  
  6. <head><title>{Title}</title>
  7.  
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12.  
  13. <!--- This is a base code by lexaofrp! You are free to remove any of my credit and replace it as your own. If you make minimal or no edits please leave the credit where it is and how it is! Do not redistribute if you made no major changes or no changes at all. Feel free too contact me fi you have any questions @ lexaofrp--->
  14.  
  15.  
  16. <!------These are the pictures you can insert into your theme------->
  17.  
  18. <meta name="image:Background" content="">
  19. <meta name="image:Sidebar" content="">
  20. <meta name="image:Header" content="">
  21.  
  22. <!---colors. All of these are available to customize at the main screen so that's pretty nice. You can have as many as you want--->
  23.  
  24. <meta name="color:Background" content="#ffffff"/> <!--- the #ffffff is the default color!--->
  25. <meta name="color:PostBG" content="#dfdfdf"/>
  26. <meta name="color:Text" content="#8f8f8f"/>
  27. <meta name="color:SBLinks" content="#8f8f8f" />
  28. <meta name="color:SBLinksBG" content="#dfdfdf"/>
  29. <meta name="color:Border" content="#8f8f8f"/>
  30. <meta name="color:Post Links" content="#8f8f8f"/>
  31. <meta name="color:Hover" content="#8f8f8f"/>
  32. <meta name="color:Scrollbar" content="#dfdfdf"/>
  33. <meta name="color:ScrollbarBg" content="#8f8f8f"/>
  34. <meta name="color:InfoBG" content="#8f8f8f"/>
  35. <meta name="color:DescBG" content="#dfdfdf"/>
  36.  
  37. <!---These are your links. If you want more you have to add them here and in your html! --->
  38.  
  39. <meta name="text:Home URL" content="/">
  40. <meta name="text:Home" content="Home">
  41. <meta name="text:Ask URL" content="/">
  42. <meta name="text:Ask" content="Ask">
  43. <meta name="text:Link 1 URL" content="/">
  44. <meta name="text:Link 1" content="Link 1">
  45. <meta name="text:Link 2 URL" content="/">
  46. <meta name="text:Link 2" content="Link 2">
  47.  
  48.  
  49. <style type="text/css">
  50.  
  51. blockquote { /*what your blockquotes will look like*/
  52. font-size:10px;
  53. font-family:'times new roman';
  54. max-width:500px;
  55. border-left:2px solid{color:Background};
  56. padding:10px;
  57. color:{color:Background};
  58. background-color:{color:DescBG};}
  59.  
  60. code {/*what your code will look like*/
  61. font-size:9px;
  62. font-family:'times new roman';
  63. color:{color:text};
  64. text-transform:uppercase;}
  65.  
  66. pre {/*what your pre will look like*/
  67. font-family:'times new roman';
  68. text-align:center;
  69. font-size:10px;
  70. max-width:500px;
  71. padding:10px ;
  72. color:{color:SBLinksBG};
  73. background-color: {color:SBLinks};}h1{/*what your h1 will look like*/
  74. font-family:'times new roman';
  75. font-size:15px;
  76. text-align:center;
  77. text-transform:uppercase;
  78. background-color:{color:infobg};
  79. color:{color:postBG};
  80. border-top:5px solid {color:PostBG};
  81. padding-top:8px;
  82. padding-bottom:5px;}
  83.  
  84. /*YOUR THEME BASICS*/
  85. body {/*This is your body, if you want to change the font of your posts change it here*/
  86. font-family: 'times new roman';
  87. font-size:10px;
  88. background-image:url('{image:background}');
  89. background-attachment:fixed;
  90. color:{color:background};
  91. background-color:{color:background}; }
  92. a {/*post links and things*/
  93. color:{color:Background};
  94. text-decoration:none;
  95. -webkit-transition:all 0.5s ease-in-out;
  96. -moz-transition:all 0.5s ease-in-out;
  97. -o-transition:all 0.5s ease-in-out;
  98. transition:all 0.5s ease-in-out;}
  99. a:hover {
  100. color:{color:Hover};
  101. text-decoration:underline;
  102. -webkit-transition:all 0.5s ease-in-out;
  103. -moz-transition:all 0.5s ease-in-out;
  104. -o-transition:all 0.5s ease-in-out;
  105. transition:all 0.5s ease-in-out;}
  106.  
  107.  
  108. /*END OF THE BASICS*/
  109.  
  110. /*SIDEBAR AND OTHER ESSENTIALS*/
  111.  
  112. .sidebar { /*what your SIDEBAR will look like*/
  113. position:fixed; /*this means it will stay in place when you scroll and scroll with you*/
  114. width:100px;/*self explanatory, the width of your sidebar in pixels*/
  115. height:100px;/*self explanatory, the height of your sidebar in pixels*/
  116. margin-left:190px;/*how far left your sidebar is from the left of your screen/the theme*/
  117. margin-top:265px;/*how far from the top your sidebar is from tyour post's top.*/
  118. padding:10px;/*there will be 10 pixels on all sides of yoru sidebar*/
  119. background-color:{color:border};/*self explanatory*/
  120. z-index:99999999999999999;/*what order the div is. the higher the number the more in front it is. ex: if there was something with a z-index of 4 and something with a z-index of 9 the one with 9 would be in front of the one with 4*/
  121. opacity:1;/*how visible something is. you can also use decimals*/
  122. }
  123.  
  124. .description {
  125. position:fixed;
  126. overflow:auto;/*it will have a scrollbar*/
  127. height:135px;
  128. width:200px;
  129. margin-left:320px;
  130. margin-top:230px;
  131. padding:10px;
  132. opacity:1;
  133. text-align:center;/*text will be in the center. you can also have left, right, and justify*/
  134. font-family:'times new roman';/*the font you're using. you can import a new font using tumblr or use any of the default fonts*/
  135. font-size:10px;
  136. background-color:{color:DescBG};
  137. color:{color:text};
  138. z-index:9999999;
  139. }
  140.  
  141. .title {
  142. position:fixed;
  143. display:block;
  144. text-align:center;
  145. padding:10px;
  146. width:100px;
  147. margin-top:230px;
  148. margin-left:190px;
  149. font-family:'times new roman';
  150. font-style:italic;/*can also be normal, italic, or oblique*/
  151. font-weight:normal;/*can also be bold*/
  152. text-transform:uppercase;
  153. font-size:8px;
  154. z-index:999999999;
  155. background-color:{color:border};
  156. color:{color:SBLinksBG}; /*color always mean the color of your textin the designated div*/}
  157.  
  158. .links {
  159. position:fixed;
  160. width:300px;
  161. height:500px;
  162. margin-left:282px;
  163. margin-top:390px;
  164. text-align:center;
  165. z-index:99999;/*the ease in-ease out properties have to do with transition duration. make sure you have all of the ones I have or the transition won't work on some browsers*/
  166. }
  167.  
  168. .links a {
  169. display:inline-block;/*the links will be in a column. you can make them be in two rows like i have by toggling the width of the links (not links a). you can also set it to block and the links will be in one row*/
  170. position:center;
  171. margin-left:2px;
  172. margin-right:5px;
  173. margin-top:5px;
  174. margin-bottom:0px;
  175. padding:5px;
  176. width:95px;
  177. font-family:'times new roman';
  178. font-style:normal;
  179. font-weight:normal;
  180. text-decoration:none;/*you can have underline, overline, line through or none*/
  181. text-transform:uppercase;
  182. font-size:10px;
  183. color:{color:SBLinks};
  184. background-color:{color:SBLinksBG};
  185. border-top:2px solid {color:infobg};/*they will have 2px border at the top*/
  186. -webkit-transition:all 0.5s ease-in-out;
  187. -moz-transition:all 0.5s ease-in-out;
  188. -o-transition:all 0.5s ease-in-out;
  189. transition:all 0.5s ease-in-out;}
  190.  
  191. .links a:hover {
  192. text-decoration:none;
  193. color:{color:Hover};
  194. -webkit-transition:all 0.5s ease-in-out;
  195. -moz-transition:all 0.5s ease-in-out;
  196. -o-transition:all 0.5s ease-in-out;
  197. transition:all 0.5s ease-in-out;}
  198.  
  199. .header{
  200. position:fixed;
  201. margin-left:600px;
  202. width:530px;
  203. height:120px;
  204. background-image:url('{image:header}');
  205. }
  206.  
  207. .pagination {/*your next page and back a page thing! It works like your links!*/
  208. display:block;
  209. position:fixed;
  210. margin-top:405px;
  211. margin-left:192px;
  212. width:120px;
  213. height:23px;
  214. padding-top:7px;
  215. z-index:9;
  216. text-align:center;}
  217.  
  218. .pagination a {
  219. display:inline-block;
  220. font-family:'times new roman';
  221. font-weight:normal;
  222. text-decoration:none;
  223. text-transform:uppercase;
  224. font-size:12px;
  225. color:{color:border};
  226. -webkit-transition:all 0.5s ease-in-out;
  227. -moz-transition:all 0.5s ease-in-out;
  228. -o-transition:all 0.5s ease-in-out;
  229. transition:all 0.5s ease-in-out;
  230. z-index:9;
  231. }
  232.  
  233. .pagination a:hover{
  234. text-decoration:none;
  235. color:{color:hover};
  236. -webkit-transition:all 0.5s ease-in-out;
  237. -moz-transition:all 0.5s ease-in-out;
  238. -o-transition:all 0.5s ease-in-out;
  239. transition:all 0.5s ease-in-out;}
  240.  
  241.  
  242. /*END SIDEBAR*/
  243.  
  244. /*POSTS*/
  245. .container{/*container for your posts. this is optional, if you don't want it delete this and the div in the html!*/
  246. position:fixed;
  247. overflow:auto;
  248. height:490px;
  249. width:530px;
  250. margin-left:600px;
  251. margin-top:120px;
  252. }
  253. .posts { /*your glorious posts!*/
  254. width:520px;
  255. color:{color:text};}
  256.  
  257. .entries {/*entries are INSIDE posts*/
  258. width:500px;
  259. padding:10px;
  260. padding-bottom:10px;
  261. color:{color:text};
  262. background-color:{color:postbg};}
  263.  
  264. .info {/*# of notes, the time posted, etc*/
  265. display:block;
  266. padding:10px;
  267. font-family:'times new roman';
  268. font-style:italic;
  269. text-align:center;
  270. color:{color:Post links};
  271. background-color:{color:InfoBG};
  272. margin-top:0px;
  273. margin-bottom:30px;
  274. margin-left:0px;
  275. width:500px;}
  276.  
  277. .info a {
  278. color:{color:Post Links};
  279. -webkit-transition:all 0.5s ease-in-out;
  280. -moz-transition:all 0.5s ease-in-out;
  281. -o-transition:all 0.5s ease-in-out;
  282. transition:all 0.5s ease-in-out;}
  283.  
  284. .info a:hover {
  285. color:{color:hover};
  286. -webkit-transition:all 0.5s ease-in-out;
  287. -moz-transition:all 0.5s ease-in-out;
  288. -o-transition:all 0.5s ease-in-out;
  289. transition:all 0.5s ease-in-out;}
  290.  
  291. .tags{
  292. text-align:right;
  293. }
  294.  
  295. .tags a {
  296. display:inline-block;
  297. margin-right:5px;
  298. background-color:{color:InfoBG};
  299. color:{color:Post Links};}
  300.  
  301. /*POST TYPES AND POST ATTRIBUTES*/
  302.  
  303. .post_title {
  304. display:block;
  305. padding:5px;
  306. text-align:center;
  307. font-size:15px;
  308. font-family:'times new roman';
  309. text-transform:uppercase;
  310. font-style:italic;}
  311.  
  312. .text {
  313. display:block;
  314. padding:5px;
  315. text-align:justify;
  316. color:{color:Text};
  317. }
  318.  
  319. .photo img {
  320. display:block;
  321. margin-bottom:5px; }
  322.  
  323. .quote {
  324. display:block;
  325. padding:10px;
  326. text-align:center;
  327. font-size:20px;
  328. font-family:'cambria';
  329. font-style:italic;
  330. border-top:5px solid {color:scrollbar};
  331. color:{color:postbg};
  332. background-color:{color:InfoBG};}
  333.  
  334. .source {
  335. display:block;
  336. padding:5px;
  337. text-align:right;
  338. font-size:9px;}
  339.  
  340. .chat li {
  341. display:block;
  342. padding:5px;
  343. color:{color:text};}
  344.  
  345. .audioimg img {
  346. width:100px;
  347. height:100px;
  348. color:{color:text};
  349. font-family:'times new roman';
  350. text-align:center;
  351. text-transform:uppercase;}
  352.  
  353. .audioinfo {
  354. color:{color:Text};}
  355.  
  356. .question {
  357. display:block;
  358. margin-top:12px;
  359. text-align:center;
  360. text-transform:Uppercase;
  361. font-size:12px;
  362. font-family:'times new roman'';
  363. font-style:normal;
  364. min-height:40px;
  365. width:500px;
  366. color:{color:sblinksbg};
  367. background-color:{color:sblinks};
  368. line-height:25px;}
  369.  
  370. .question img {
  371. margin-right:5px;
  372. margin-bottom:-10px;}
  373.  
  374. .asker{
  375. color:{color:SBLinksBG};
  376. font-family:'times new roman';
  377. font-size:15px;
  378. display:block;
  379. text-align:right;
  380. height:20px;
  381. padding-top:5px;
  382. margin-top:-7px;
  383. margin-bottom:-22px;
  384. background-color:{color:post links};
  385. padding-bottom:5px;
  386. letter-spacing:2px;
  387. z-index:99999;
  388. }
  389.  
  390. /*NOTES DO NOT REMOVE*/
  391. .notes {
  392. font-family:'times new roman';
  393. text-align:center;
  394. text-transform:uppercase;
  395. font-size:8px;
  396. width:520px;
  397. margin-left:-30px;
  398. margin-top:20px;
  399. color:{color:SBLINKS};
  400. background-color:rgba(0,0,0,0);/*the rgba thing makes it transparent*/
  401. }
  402.  
  403. .notes a{
  404. color:{color:SBLINKSBG};
  405. }
  406.  
  407. .notes li{
  408. list-style-type:none;
  409. background-color:rgba(0,0,0,0);
  410. padding:5px;
  411. }
  412.  
  413. .notes img {
  414. opacity:0;
  415. display:none;
  416. }
  417. /*END NOTES*/
  418. /*END POSTS*/
  419.  
  420. ::-webkit-scrollbar {/*your scrollbar*/
  421. height:7px;
  422. width:7px;
  423. background-color:{color:scrollbarBG};}
  424.  
  425. ::-webkit-scrollbar-thumb {
  426. height:auto;
  427. background-color:{color:scrollbar};}
  428.  
  429. /*CREDIT*/
  430. #credit { /*you can put in your own things here! no need to credit me anywhere in your code!!*/
  431. position:fixed;
  432. font-family:'times new roman';
  433. color:{color:Border};
  434. text-transform:uppercase;
  435. font-size:10px;
  436. background-color:{color:postbg};
  437. right:10px;
  438. bottom:10px;
  439. padding:5px;
  440. opacity:1;
  441. border:2px solid {color:border};
  442. }
  443.  
  444. </style>
  445.  
  446. </head>
  447. <!--HTML-->
  448. <body>
  449.  
  450. </ul>
  451. <div class="header"></div>
  452. <div class="sidebar"><img src="{image:sidebar}"></div><!---you need to have one of these for everything in your css or it won't show up!--->
  453. <div class="links">
  454. {block:ifHome}<a href="{text:Home URL}">{text:Home}</a>{/block:ifHome}
  455. {block:ifAsk}<a href="{text:Ask URL}">{text:Ask}</a>{/block:ifAsk}
  456. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  457. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2} <!--- add more links by copy and pasting whats above until you hav eyour desired amount!--->
  458.  
  459. </div>
  460.  
  461. {block:Pagination}
  462. <div class="pagination">
  463. {block:PreviousPage}
  464. <a href="{PreviousPage}">← sink</a>
  465. {/block:PreviousPage}
  466.  
  467. {block:NextPage}
  468. <a href="{NextPage}">float →</a>
  469. {/block:NextPage}
  470. </div>
  471. {/block:Pagination}
  472.  
  473. </div>
  474. <div class="title">{Title}</div></div></div>
  475. <div class="description">
  476. {Description}
  477. </div></div>
  478. <!--POSTS-->
  479. <div class="container">
  480. <div class="posts">
  481.  
  482. {block:Posts}
  483.  
  484. <div class="entries">
  485.  
  486. <!--TEXT POSTS-->
  487.  
  488. {block:Text}
  489.  
  490. {block:Title}<div class="post_title">{Title}</div>{/block:Title}
  491. <div class="text">{Body}</div>
  492.  
  493. {/block:Text}
  494.  
  495. <!--END TEXT POSTS-->
  496.  
  497. <!--PHOTO POSTS-->
  498.  
  499. {block:Photo}
  500.  
  501. <div class="photo"><center><img src="{PhotoURL-500}"/></center></div>
  502. <div class="text">{Caption}</div>
  503.  
  504. {/block:Photo}
  505.  
  506. <!--END PHOTO POSTS-->
  507.  
  508. <!--PHOTOSET POSTS-->
  509.  
  510. {block:Photoset}
  511.  
  512. <center><div class="photo">{Photoset-500}</div></center>
  513. <div class="text">{Caption}</div>
  514.  
  515. {/block:Photoset}
  516.  
  517. <!--END PHOTOSET POSTS-->
  518.  
  519. <!--QUOTE POSTS-->
  520.  
  521. {block:Quote}
  522.  
  523. <div class="quote">"{Quote}"</div>
  524. <div class="source">{Source}</div>
  525.  
  526. {/block:Quote}
  527.  
  528. <!--END QUOTE POSTS-->
  529.  
  530. <!--LINK POSTS-->
  531.  
  532. {block:Link}
  533.  
  534. <div class="post_title"><a href="{URL}">{Name} &rarr;</a></div>
  535. {block:Description}<div class="text">{Description}</div>{/block:Description}
  536.  
  537. {/block:Link}
  538.  
  539. <!--END LINK POSTS-->
  540.  
  541. <!--CHAT POSTS-->
  542.  
  543. {block:Chat}
  544.  
  545. {block:Title}<div class="post_title">{Title}</div>{/block:Title}
  546. <div class="chat">
  547. <ul>
  548. {block:Lines}<li class="{Alt}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</li>{/block:Lines}
  549. </ul>
  550. </div>
  551.  
  552. {/block:Chat}
  553.  
  554. <!--END CHAT POSTS-->
  555.  
  556. <!--AUDIO POSTS-->
  557.  
  558. {block:Audio}
  559.  
  560. <table>
  561. <tr>
  562. <td>
  563. {block:AlbumArt}<div class="audioimg"><img src="{AlbumArtURL}"/></div>{/block:AlbumArt}
  564. </td>
  565. <td>
  566. <div class="audioplayer">{AudioPlayerBlack}</div>
  567. <div class="audioinfo">{block:Artist}<b>Name</b>: {Artist}{/block:Artist}<br>
  568. {block:Album}<b>Album</b>: {Album}{/block:Album}<br>
  569. {block:TrackName}<b>Track</b>: {TrackName}{/block:TrackName}</div>
  570. </td>
  571. </tr>
  572. </table>
  573. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  574.  
  575. {/block:Audio}
  576.  
  577. <!--END AUDIO POSTS-->
  578.  
  579. <!--VIDEO POSTS-->
  580.  
  581. {block:Video}
  582.  
  583. <center><div class="photo">{VideoEmbed-500}</div></center>
  584. <div class="text">{Caption}</div>
  585.  
  586. {/block:Video}
  587.  
  588. <!--END VIDEO POSTS-->
  589.  
  590. <!--ANSWER POSTS-->
  591.  
  592. {block:Answer}<div id="answer">
  593. <div class="question">
  594. <div class="asker">{Asker}</div><br/><div class="q">{Question}</div></div>
  595. {block:Answerer}<br/><br/><div class="question"><div class="asker">{Answerer}</div><br/><div class="q">{Answer}</div></div>{/block:Answerer}{Replies}</div>{/block:Answer}
  596.  
  597. <!--END ANSWER POSTS-->
  598. </div>
  599. <div class="info">
  600. <a><a href="{Permalink}"> {12Hour}:{Minutes}{CapitalAmPm} | {TimeAgo}</a></a>
  601. | {NoteCountWithLabel}<br>
  602. {block:HasTags}
  603. <div class="tags">tagged as: {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>
  604. {/block:HasTags}</div>
  605. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  606. {/block:Posts}
  607.  
  608. </div>
  609. {/block:PermalinkPage}
  610. </div>
  611.  
  612. </div>
  613. </div>
  614. <div id="credit">
  615. <a href="http://lexaofrp.tumblr.com" title="lexaofrp">lexaofrp</a>
  616. </div>
  617. </div>
  618. </div>
  619. <!--END POSTS-->
  620.  
  621. </body>
  622.  
  623. </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!