API tools faq
paste
Advertisement
ranmouri

EXO blogger.com Layout 01

ranmouri
Jul 27th, 2014
277
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.46 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  4.  
  5.  
  6. <!-- LAYOUT BY XEHUN.BLOGSPOT.COM -->
  7.  
  8. <head>
  9.  
  10. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  11. <meta name="description" content="Confessions of a far too ordinary kid. Sometimes I rant a lot and I really enjoy making designs, too." />
  12. <meta name="keywords" content="journal, university, korea" />
  13. <meta name="author" content="http://www.xehun.blogspot.com" />
  14. <title><$BlogPageTitle$></title>
  15.  
  16. <script type="text/javascript">
  17. function changeNavigation(id)
  18. {document.getElementById('content').innerHTML=document.getElementById(id).innerHTML}
  19. </script>
  20.  
  21. <link rel="shortcut icon" href="http://media.tumblr.com/tumblr_lkl5wlknWm1qfamg6.png">
  22.  
  23.  
  24. <style type="text/css">
  25.  
  26. @font-face {
  27. font-family: nilland;
  28. src: url(http://static.tumblr.com/m6lylkj/kWan1pg8a/nilland.ttf);
  29. }
  30.  
  31.  
  32. ::-moz-selection {
  33. background:#F2EBF3;
  34. color: #BCB5BF;
  35. text-shadow:1px 1px 0 #fff;
  36. }
  37.  
  38. ::selection {
  39. background:#F2EBF3;
  40. color: #BCB5BF;
  41. text-shadow:1px 1px 0 #fff;
  42. }
  43.  
  44. ::-webkit-scrollbar {
  45. width:3px;
  46. background:#FCFCFC;
  47. }
  48.  
  49. ::-webkit-scrollbar-thumb:horizontal {
  50. width:0px;
  51. background:#FCFCFC;
  52. }
  53.  
  54. ::-webkit-scrollbar-thumb {
  55. background:#F2EBF3;
  56. }
  57.  
  58. body {
  59. width:100%; cursor: url(http://i.imgur.com/ZOrzC.png), auto; text-align:left; margin:0; line-height:12px; color:#747474;
  60. background-color:#eaeaea;
  61. font-family: arial;
  62. font-size: 11px;
  63. line-height: auto;
  64. font-family: arial;
  65. word-wrap: break-word;
  66. text-align: justify;
  67. margin-bottom: 50px;
  68. background-attachment: fixed;
  69. background-repeat: repeat;
  70. background-color:#eaeaea;
  71. background-image:url('http://static.tumblr.com/d20e5b34e460f8e8878a0456434100bb/fowzldg/bUMn6vdhy/tumblr_static_3dktocodqmgwc4o88gsgo44k8.png');
  72. }
  73. a:link, a:active, a:visited {
  74. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
  75. text-decoration:none;
  76. color:#b8b8b8;
  77. -webkit-transition: all 0.3s linear;
  78. -moz-transition: all 0.3s linear;
  79. transition: all 0.3s linear;
  80. }
  81.  
  82. a:hover {
  83. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
  84. color: #666666;
  85. -webkit-transition: all 0.3s linear;
  86. -moz-transition: all 0.3s linear;
  87. transition: all 0.3s linear;
  88. }
  89.  
  90. h1 {
  91. display: block;
  92. text-align: center;
  93. font-family: calibri;
  94. font-weight: bold;
  95. letter-spacing: 1px;
  96. font-size: 11px;
  97. padding: 5px;
  98. margin-top: 0px;
  99. margin-bottom: 3px;
  100. background: #FBFBFB;
  101. border-bottom: 1px solid #F0F0F0;
  102. }
  103.  
  104.  
  105. h2 {
  106. font-family: calibri;
  107. color:#cccccc;
  108. font-weight: normal;
  109. text-indent: 5px;
  110. text-transform: uppercase;
  111. letter-spacing: 1px;
  112. font-size: 9px;
  113. display: block;
  114. padding: 5px;
  115. margin-top: 2px;
  116. background: #FBFBFB;
  117. border-left: 10px solid #F0F0F0;
  118. }
  119.  
  120.  
  121. h3 {
  122. font-family: calibri;
  123. font-weight: normal;
  124. text-indent: 5px;
  125. text-transform: uppercase;
  126. letter-spacing: 1px;
  127. font-size: 9px;
  128. display: block;
  129. padding: 5px;
  130. margin-top: 0px;
  131. margin-bottom: -8px;
  132. background: #FBFBFB;
  133. }
  134.  
  135.  
  136. hr {
  137. border: 0;
  138. height: 3px;
  139. background: #FFF;
  140. }
  141.  
  142.  
  143. b, strong {
  144. color:#f3cfd3;
  145. font-weight:bold;
  146. }
  147.  
  148.  
  149. i, em {
  150. color:#afe0cc;
  151. font-style: oblique;
  152. }
  153.  
  154. #bottom{
  155. clear:both;
  156. background-color: #fbfbfb;
  157. text-align:center;
  158. padding:5px;
  159. }
  160.  
  161. pre, xmp, plaintext, listing {
  162. display: block;
  163. white-space: pre;
  164. background: #FBFBFB;
  165. padding: 5px;
  166. }
  167.  
  168.  
  169. p {
  170. display: block;
  171. -webkit-margin-before: 5px;
  172. -webkit-margin-after: 5px;
  173. -webkit-margin-start: 0px;
  174. -webkit-margin-end: 0px;
  175. }
  176.  
  177.  
  178. small {
  179. font-size: 10px !important;
  180. color: #f0d6df;
  181. letter-spacing: 1px;
  182. -webkit-margin-before: 0px;
  183. -webkit-margin-after: 0px;
  184. -webkit-margin-start: 0px;
  185. -webkit-margin-end: 0px;
  186. }
  187.  
  188.  
  189. blockquote {
  190. display: block;
  191. padding: 0px 5px 0px 5px;
  192. font-size: 10px !important;
  193. border-left: 2px solid #F4F4F4;
  194. -webkit-margin-before: 5px;
  195. -webkit-margin-after: 5px;
  196. -webkit-margin-start: 5px;
  197. -webkit-margin-end: 5px;
  198. }
  199.  
  200. blockquote p {
  201. -webkit-margin-before: 5px;
  202. -webkit-margin-after: 5px;
  203. -webkit-margin-start: 0px;
  204. -webkit-margin-end: 0px;
  205. }
  206.  
  207. #container{
  208. margin: 0 auto;
  209. margin-top:-10px;
  210. width:858px;
  211. min-height:1100px;
  212. background-color:#ffffff;
  213. border:1px solid #eeeeee;
  214. }
  215.  
  216. #header{
  217. margin-top:5px;
  218. width:844px; height: 260px;
  219. border:6px double #fff;
  220. background-image: url('http://static.tumblr.com/fowzldg/hThn9efjr/12.png');
  221. }
  222.  
  223. #sidebar{
  224. float: left;
  225. width: 213px;
  226. padding:5px;
  227. margin:4px;
  228. color:#cccccc;
  229. padding-right:0px;
  230. background-color:#ffffff;
  231. }
  232.  
  233. #content{
  234. float: right;
  235. width: 520px;
  236. padding:40px;
  237. margin:10px;
  238. padding-top:15px;
  239. padding-bottom:15px;
  240. background-color:#fbfbfb;
  241. border:4px double;
  242. border-color:#e0e0e0;
  243. }
  244.  
  245. #footer{
  246. clear:both;
  247. background-color:#ffffff;
  248. border-top:1px solid #eeeeee;
  249. text-align:center;
  250. padding:5px;
  251. }
  252.  
  253. #navigation{
  254. width: 840px;
  255. height: 23px;
  256. padding:0px; margin:4px;
  257. margin-bottom:-5px;
  258. font-family: calibri;
  259. font-weight: normal;
  260. text-indent: 5px;
  261. text-transform: uppercase;
  262. letter-spacing: 1px;
  263. font-size: 9px;
  264. display: block;
  265. padding: 5px;
  266. margin-top: 0px;
  267. margin-bottom: -8px;
  268. background: #fff;
  269.  
  270. }
  271.  
  272. #navigation:hover {
  273. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
  274. -webkit-transition: all 0.3s linear;
  275. -moz-transition: all 0.3s linear;
  276. transition: all 0.3s linear;
  277. }
  278.  
  279.  
  280. #navigation ul{
  281. padding: 0px;
  282. margin: 0px;
  283. text-align: center;
  284. }
  285. #navigation ul li{
  286. float: left;
  287. width: 14.2%;
  288. padding: 0px;
  289. margin: 0px;
  290. list-style: none;
  291. }
  292. #navigation ul li a{
  293. display: block;
  294. padding: 0px;
  295. margin: 0px 1px;
  296. text-align: center;
  297. text-decoration: none;
  298. background: #fff;
  299. font-size: 14px; line-height:10px;
  300.  
  301. font-family: calibri;
  302. font-weight: normal;
  303. text-indent: 5px;
  304. text-transform: uppercase;
  305. letter-spacing: 1px;
  306. font-size: 9px;
  307. display: block;
  308. padding: 2px;
  309. margin-top: 0px;
  310.  
  311. }
  312.  
  313.  
  314. a:link, a:active, a:visited {
  315. text-decoration: none;
  316. color: #736F6E;
  317. }
  318. a:hover {
  319. color: #ffffff;
  320. text-decoration: none;
  321. }
  322.  
  323. a.nav:link, a.nav:active, a.nav:visited{
  324. font-family: "tahoma";
  325. text-align:left;
  326. padding:3px; margin:1px;
  327. padding-left:10px;
  328. font-size: 10px;
  329. color: #eee;
  330. background-color:#ccc;
  331. display:block;
  332. }
  333. a.nav:hover{
  334. font-family: "tahoma";
  335. text-align:left;
  336. padding:3px; margin:1px;
  337. padding-left:10px;
  338. font-size: 10px;
  339. color: #fff;
  340. background-color:#d2d2d2;
  341. display:block;
  342. }
  343.  
  344. h1{
  345. font-family: helvetica;
  346. font-weight: bold;
  347. font-size: 22px;
  348. line-height: 22px;
  349. color: #c1bfbc;
  350. text-align: left;
  351. }
  352.  
  353. img {
  354. background: #F8F8F8;
  355. padding: 4px; border: 1px solid #f1f1f1; margin-bottom: 5px; margin-top: 5px;
  356. }
  357.  
  358. e img {
  359. padding:5px;
  360. border:1px solid #eeeeee;
  361. background-color:#fbfbfb;
  362. opacity: 0.5;
  363.  
  364. -webkit-filter: grayscale(100%);
  365. z-index: -9999999999999999999999999px;
  366. -webkit-transition: all 0.9s ease-in-out;
  367. -moz-transition: all 0.9s ease-in-out;
  368. -o-transition: all 0.9s ease-in-out;
  369. -ms-transition: all 0.9s ease-in-out;
  370. transition: all 0.9s ease-in-out;
  371. }
  372.  
  373. e img:hover {
  374. -webkit-filter: grayscale(0%);
  375. z-index: -9999999999999999999999999px;
  376. -webkit-transition: all 0.9s ease-in-out;
  377. -moz-transition: all 0.9s ease-in-out;
  378. -o-transition: all 0.9s ease-in-out;
  379. -ms-transition: all 0.9s ease-in-out;
  380. transition: all 0.9s ease-in-out;
  381.  
  382. opacity: 1;
  383. }
  384.  
  385. a.load:link, a.load:active, a.load:visited{
  386. font-family: "arial black";
  387. text-align:center;
  388. padding:3px; margin:5px;
  389. font-size: 20px;
  390. color: #eee;
  391. font-weight:normal;
  392. background-color:#ccc;
  393. text-transform: uppercase;
  394. }
  395. a.load:hover{
  396. font-family: "arial black";
  397. text-align:center;
  398. padding:3px; margin:5px;
  399. font-size: 20px;
  400. color: #fff;
  401. background-color:#d2d2d2;
  402. text-transform: uppercase;
  403. }
  404. </style> </head>
  405. <body>
  406.  
  407.  
  408. <div id="container">
  409.  
  410. <tr>
  411. <td><center><div id="header"></div></tr>
  412. </td></center>
  413.  
  414. <tr>
  415. <td>
  416. <div id="navigation">
  417. <ul>
  418. <li><span onClick="changeNavigation('blog')">home</span></li>
  419. <li><span onClick="changeNavigation('girl')">the blogger</span></li>
  420. <li> <span onClick="changeNavigation('tags')">tags</span></li>
  421. <li> <span onClick="changeNavigation('designs')">designs</span></li>
  422. <li> <span onClick="changeNavigation('links')">links</span></li>
  423. <li> <span onClick="changeNavigation('affiliation')">affiliation</span></li>
  424. <!-- DO NOT REMOVE! THANK YOU! -->
  425. <li><a href="http://xehun.blogspot.com" target="_blank" >credit</a></li>
  426. </ul>
  427. </div>
  428. </td>
  429. </tr>
  430.  
  431. <tr valign="top">
  432. <td width="250" cellpadding="2">
  433. <div id="sidebar">
  434.  
  435. <h2>우리 모두는 다른 그 누군가에게 똘아이다</h2>
  436. bold italic underline link Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoree magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
  437. <center>
  438. <e><img src="https://secure.static.tumblr.com/89da158a0cbdfb7e1a7e596e00edb8f0/fowzldg/DP8n6vdjv/tumblr_static_c7iak2roq5ck4gocwog8os0gg.gif" width="204" title="yifan you idiot"></e></center>
  439.  
  440. bold italic underline link Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoree magna aliquam erat volutpat.
  441. <br><br>
  442.  
  443. <h2>Tagboard</h2>
  444.  
  445. your cbox code width should be 200 and height 150
  446.  
  447.  
  448. <h2>affiliates</h2>
  449. <a href="http://xehun.blogspot.com" target="_blank"><b>affie</b></a>
  450. <a href="http://xehun.blogspot.com" target="_blank"><i>affie</i></a>
  451. <a href="http://xehun.blogspot.com" target="_blank"><b>affie</b></a>
  452. <a href="http://xehun.blogspot.com" target="_blank"><i>affie</i></a>
  453. <a href="http://xehun.blogspot.com" target="_blank"><b>affie</b></a>
  454. <a href="http://xehun.blogspot.com" target="_blank"><i>affie</i></a>
  455. <a href="http://xehun.blogspot.com" target="_blank"><b>affie</b></a>
  456. <a href="http://xehun.blogspot.com" target="_blank"><i>affie</i></a>
  457. <br>
  458.  
  459. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoree magna aliquam erat volutpat.
  460. <br><br>
  461.  
  462.  
  463. </div>
  464. </td>
  465. </tr>
  466.  
  467.  
  468. <table>
  469. <td id="content">
  470. <Blogger>
  471. <div class="title"><h1><BlogItemTitle><$BlogItemTitle$> </BlogItemTitle></h1></div>
  472.  
  473. <div class="title1"><h3>written on <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$> ✈</h3></div><br>
  474.  
  475. <div style="text-align: justify;color: #666666; font-family:arial; font-size: 8pt; "><$blogitembody$></div>
  476.  
  477. <div style="text-align: right;"><h3><BlogItemCommentsEnabled>
  478. <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$><b><$BlogItemCommentCount$></b> comment[s]</a></BlogItemCommentsEnabled>
  479. | <a href="javascript:scroll(0,0)">back to top </a></span></h2>
  480. <hr style="border:solid #ffffff 1px;height:1px;"></h3><br></div>
  481. </Blogger>
  482. </td>
  483.  
  484. <td id="blog" style="display: none;">
  485. <Blogger>
  486. <div class="title"><h1><BlogItemTitle><$BlogItemTitle$> </BlogItemTitle></h1></div>
  487.  
  488. <div class="title1"><h3>written on <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$> ✈</h3></div><br>
  489.  
  490. <div style="text-align: justify;color: #666666; font-family:arial; font-size: 8pt; "><$blogitembody$></div>
  491.  
  492. <div style="text-align: right;"><h3><BlogItemCommentsEnabled>
  493. <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$><b><$BlogItemCommentCount$></b> comment[s]</a></BlogItemCommentsEnabled>
  494. | <a href="javascript:scroll(0,0)">back to top </a></span></h2>
  495. <hr style="border:solid #ffffff 1px;height:1px;"></h3><br></div>
  496. </Blogger>
  497. </td>
  498.  
  499.  
  500. <td id="girl" style="display: none;">
  501. <h1>about me</h2>
  502. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
  503.  
  504. <br>
  505. </td>
  506.  
  507. <td id="tags" style="display: none;">
  508. <h1>tags</h2>
  509. <li>link</li>
  510. <li>link</li>
  511. <li>link</li>
  512.  
  513. <br>
  514. </td>
  515.  
  516. <td id="designs" style="display: none;">
  517. <h1>designs</h2>
  518.  
  519. layouts header blah
  520.  
  521. <br>
  522. </td>
  523.  
  524.  
  525. <td id="links" style="display: none;">
  526. <h1>networks</h2>
  527.  
  528. twitter, facebook, youtube, tumblr, other blogs, etc
  529.  
  530. <br>
  531. </td>
  532.  
  533.  
  534.  
  535. <td id="affiliation" style="display: none;">
  536. <h1>affiliation</h2>
  537.  
  538. <h2>link me</h2>
  539. [link me buttons]
  540.  
  541. <br><br><br>
  542. <h2>affies</h2>
  543. [all my affies]
  544.  
  545. <br>
  546. </td>
  547.  
  548. <tr>
  549. <td>
  550. <!-- DONT YOU DARE REMOVING THIS -->
  551. <div id="footer" style="color:#cccccc">
  552. blogger layout coded by <a href="http://xehun.blogspot.com" target="_blank" style="color:#cccccc"><u>xehun</u></a> | <a href="http://punk-rose.com" target="_blank" style="color:#cccccc">base</a>
  553. </div>
  554. </td>
  555. </tr>
  556. </table>
  557. </html>
  558. </body>
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!