SHARE
TWEET

SATEURS - Ingyenes Blogspot klasszikus galaktikus kinézet #2

cyberthea Jun 30th, 2017 (edited) 63 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!-- a témát készítette: Thea (http://themesbythea.blogspot.hu ÉS http://mindenurlfoglalt.blogspot.hu) -->
  2.  
  3. <html>
  4. <head>
  5.  
  6. <!-- emiatt a sorocska miatt működnek az ikonok (ne töröld) -->
  7. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  8.  
  9. <!-- emiatt a sorocska miatt működik a betűtípus (ne töröld) -->
  10. <link href="https://fonts.googleapis.com/css?family=Raleway&amp;subset=latin-ext" rel="stylesheet">
  11.  
  12. <!-- favicon (a href=" " közötti linket cseréld ki a saját faviconodra-->
  13. <link href="https://goo.gl/hQ5G2S" rel="icon" type="image/x-icon"/>
  14.  
  15. <title><$blogpagetitle$></title>
  16.  
  17. <style type="text/css">
  18.  
  19. /* mindenegyben, például linkek, félkövér, kijelölés stb. kinézete
  20. ----------------------------------------------- */
  21. body {
  22. background-color: #fff;
  23. font-family: 'Raleway', sans-serif;
  24. font-size: 12px;
  25. font-weight: normal;
  26. color: #5f5f5f;
  27. line-height: 17px;
  28. cursor: url(https://goo.gl/Qu3Vdg), default;
  29. }
  30.  
  31. a:link, a:active, a:visited {
  32. color: #000;
  33. text-decoration: none;
  34. -webkit-transition:.2s;
  35. }
  36.  
  37. a:hover, #title a:hover {
  38. color: #335ea3;
  39. color: transparent;
  40. text-shadow: #335ea3 2px 2px 2px;
  41. text-decoration: none;
  42. }
  43.  
  44. blockquote {
  45. font-size: 12px;
  46. color: #fff;
  47. background: url("https://media.giphy.com/media/Jm0s71jW4LPa0/giphy.gif");
  48. padding: 10px;
  49. }
  50.  
  51. ::-moz-selection {
  52. color: transparent;
  53. text-shadow: 0px 0px 1px #000000; }
  54. ::selection {
  55. color:transparent;
  56. text-shadow: 0px 0px 1px #000000; }
  57.  
  58. ::-webkit-scrollbar {
  59. width: 5px;
  60. background:#fff; }
  61.  
  62. ::-webkit-scrollbar-thumb {
  63. background-color: #999 ;
  64. }
  65.  
  66. ::-webkit-scrollbar-thumb:hover {
  67. background-color: #5f5f5f;
  68. }
  69.  
  70. /* blog
  71. ----------------------------------------------- */
  72. .blog-body {
  73. left: 25%;
  74. top: 370px;
  75. position: absolute;
  76. width: 50%;
  77. }
  78.  
  79. .blog-entry {
  80. font-family: Raleway, sans-serif;
  81. font-size: 12px;
  82. line-height: 17px;
  83. text-align: justify;
  84. padding: 10px;
  85. background: #f9f9f9;
  86. -webkit-opacity: .8;
  87. opacity:0.8;
  88. filter:alpha(opacity=80);
  89. moz-opacity: .8;
  90. margin-bottom: 15px;
  91. }
  92.  
  93. .blog-entry img {
  94. max-width: 95%;
  95. height: auto;
  96. padding: 4px;
  97. border: none;
  98. }
  99.  
  100. .post-title {
  101. font-size: 23px;
  102. text-align: center;
  103. padding-left: 20px;
  104. padding-top: 5px;
  105. padding-bottom: 5px;
  106. margin-bottom: 2px;
  107. }
  108.  
  109. .info{
  110. font-family: 'Raleway', sans-serif;
  111. font-size: 11px;
  112. color: #444444;
  113. text-transform: uppercase;
  114. }
  115.  
  116. #me {
  117. background: #000;
  118. bottom: 10px;
  119. right: 10px;
  120. position: fixed;
  121. padding: 2px;
  122. text-transform: uppercase;
  123. letter-spacing: 2px;
  124. -webkit-opacity: .8;
  125. opacity:0.8;
  126. filter:alpha(opacity=80);
  127. moz-opacity: .8;
  128. }
  129.  
  130. #me a {
  131. color: #fff;
  132. }
  133.  
  134. #me a:hover {
  135. color: #fff;
  136. }
  137.  
  138. html, body, a:hover {
  139. cursor: url(https://goo.gl/Qu3Vdg), progress !important;
  140. }
  141.  
  142. /* fejléc
  143. ----------------------------------------------- */
  144. .header {
  145. background: url(https://goo.gl/eW6cMm);
  146. background-repeat: repeat;
  147. background-color: #f9f9f9;
  148. text-align: center;
  149. top: 0px;
  150. left: 0px;
  151. margin-top: -76px;
  152. margin-left: -8px;
  153. padding-right: 16px;
  154. width: 100%;
  155. height: 350px;
  156. }
  157.  
  158. .headerbox1 {
  159. background-color: #f4f4f4;
  160. width: 300px;
  161. height: 290px;
  162. position: absolute;
  163. top: 20px;
  164. left: 22%;
  165. padding: 8px;
  166. margin-right: 8px;
  167. }
  168.  
  169. .headerbox2 {
  170. background-color: #f4f4f4;
  171. width: 300px;
  172. height: 290px;
  173. position: absolute;
  174. top: 20px;
  175. left: 53%;
  176. padding: 8px;
  177. text-align: center;
  178. margin-left: 8px;
  179. }
  180.  
  181. a.affies {
  182. background: url(https://goo.gl/eW6cMm);
  183. color: #fff;
  184. font-weight: bold;
  185. font-size: 10px;
  186. font-family: 'Raleway', sans-serif;
  187. text-transform: uppercase;
  188. letter-spacing: 2px;
  189. margin-left: 2px;
  190. margin-bottom: 6px;
  191. text-align: center;
  192. width: 42%;
  193. padding: 6px;
  194. border: 1px solid #d4c0b2;
  195. display: inline-block;
  196. filter: alpha(opacity = 80);
  197. opacity:.8;
  198. -moz-transition-duration: 1s;-
  199. webkit-transition-duration: 1s;
  200. }
  201.  
  202. a.affies:hover {
  203. color: #fff;
  204. color: transparent;
  205. text-shadow: #f5f5f5 2px 2px 2px;
  206. text-decoration: none;
  207. background-color: transparent;
  208. -webkit-transition: all 0.5s ease-in-out;
  209. -moz-transition: all 0.5s ease-in-out;
  210. -o-transition: all 0.5s ease-in-out;
  211. -ms-transition: all 0.5s ease-in-out;
  212. transition: all 0.5s ease-in-out;
  213. }
  214.  
  215. .name {
  216. font-size: 20px;
  217. text-transform: uppercase;
  218. }
  219.  
  220. .boxtitle {
  221. font-size: 15px;
  222. text-transform: uppercase;
  223. }
  224.  
  225. .line {
  226. width: 70px;
  227. border-top: 1px solid #222222;
  228. margin-top: -10px;
  229. }
  230.  
  231. .headerimg {
  232. width: 100px;
  233. height: 100px;
  234. border: 0px solid #eee;
  235. padding: 0px;
  236. border-radius: 200px;
  237. -moz-border-radius: 200px;
  238. -webkit-border-radius: 200px;
  239. margin-top: 10px;
  240. margin-bottom: 5px;
  241. }
  242.  
  243. /* felugró ablak
  244. ----------------------------------------------- */
  245. .popup_block {
  246. font-family: 'Raleway', sans-serif;
  247. font-size: 12px;
  248. text-align: justify;
  249. display: none;
  250. padding: 15px;
  251. border: 1px solid #EEEEEE;
  252. float: left;
  253. position: fixed;
  254. top: 50%;
  255. left: 50%;
  256. z-index: 99999;
  257. -webkit-box-shadow: 0px 0px 30px #000000;
  258. - -box-shadow: 0px 0px 30px #000000;
  259. box-shadow: 0px 0px 30px #000000;
  260. background:url(https://goo.gl/cRnUGf);
  261. }
  262.  
  263. img.btn_close {
  264. float: right;
  265. margin: -2px -2px 0 0;
  266. }
  267.  
  268. *html #fade {
  269. position: absolute;
  270. }
  271.  
  272. *html .popup_block {
  273. position: absolute;
  274. }
  275.  
  276. #navbar-iframe {
  277. display: none;
  278. }
  279.  
  280. #navbar-iframe {
  281. display: none;
  282. }
  283.  
  284. </style></head><body>
  285. <br><br><br><br>
  286.  
  287. <!--- fejléc: első szövegdoboz ---!>
  288. <div class="header">
  289. <div class="headerbox1">
  290. <!--- ha le szeretnéd cserélni az első szövegdobozban megjelenő képet, a src=" " közötti linket írd át ---!>
  291. <img class="headerimg" src="https://goo.gl/o2dYk9" href="/"><br><br>
  292.  
  293. <!--- írd át az alábbi SATEURS szöveget a saját blogod nevére, a href=" " közötti linket pedig a saját blogod linkjére ---!>
  294. <center><div class="name"><a href="http://sateurs.blogspot.hu">SATEURS</a></div><br>
  295. <div class="line"></div></center><br>
  296. Az oldalad leírásának helye. Ide jöhet például egy rövidke kis üdvözlőszöveg, vagy éppen pár szó rólad, tehát bármi, ami a fejedben motoszkál. <br>
  297. <center> <b>félkövér,</b> <i>dőlt,</i> <u>aláhúzott,</u> <s>áthúzott</s>
  298. <br><br>
  299.  
  300. <!-- menü -  itt csak a menüpontok neveit írhatod át!-->
  301. <b><a href="http://www.blogger.com/follow-blog.g?blogID=<$blogID$>" target="_blank">#kövessbe</a> <a href="#?w=400" rel="02" class="poplight" class="nav">#ismerjmeg</a> <a href="#?w=400" rel="01" class="poplight" class="nav">#mindenegyéb</a></b>
  302.  
  303. </div>
  304.  
  305. <!--- fejléc: második szövegdoboz ---!>
  306. <div class="headerbox2">
  307. <br><center><div class="boxtitle"> Cserebere és archívum </div></center><br>
  308. <center>
  309. <a class="affies" href="IDE JÖN A LINK">Gizella</a>
  310. <a class="affies" href="IDE JÖN A LINK">István</a>
  311. <a class="affies" href="IDE JÖN A LINK">József</a>
  312. <a class="affies" href="IDE JÖN A LINK">Erzsébet</a>
  313. <a class="affies" href="IDE JÖN A LINK">Magdolna</a>
  314. <a class="affies" href="IDE JÖN A LINK">Béla</a>
  315. <a class="affies" href="IDE JÖN A LINK">Mária</a>
  316. <a class="affies" href="IDE JÖN A LINK">Géza</a>
  317. <a class="affies" href="IDE JÖN A LINK">Gyula</a>
  318. <a class="affies" href="IDE JÖN A LINK">Abigél</a>
  319. </center>
  320. <br>
  321.  
  322. <!-- kedvedre átírhatod a "múlt ▲▼▲▼", a "mostanában" és a "havonta" szavakat, a többihez ne nyúlj -->
  323. <center>
  324. <form name="jump" id="jump">
  325. <select name="menu" onchange="location=document.jump.menu.options
  326. [document.jump.menu.selectedIndex].value;" value="GO" style="font-family: raleway; font-size: 12px; text-transform: lowercase; color: #777777; width: 100%; border: 1px solid #DDDDDD; background-color: #FFFFFF; padding: 1px;">
  327. <option selected="selected">a múlt ▲▼▲▼</option>
  328. <optgroup label="mostanában" style="font:bold 11px raleway;">
  329. <BloggerPreviousItems>
  330. <option value="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></option>
  331. </BloggerPreviousItems>
  332. <optgroup label="havonta" style="font:bold 11px raleway;">
  333. <BloggerArchives>
  334. <option value="<$BlogArchiveURL$>"><$BlogArchiveName$></option>
  335. </BloggerArchives>
  336. </select></form></center>
  337. </div>
  338. </div></div>
  339.  
  340. <!--- bejegyzések - ehhez itt ne nyúlj ---!>
  341. <div id="me">
  342. <a href="http://themesbythea.blogspot.hu/" target="_blank">©</a>
  343. </div>
  344. <div class="blog-body">
  345. <blogger><div class="blog-entry"><div class="post-title">
  346. <a href="<$BlogItemPermalinkURL$>"</a><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></a></div>
  347. <center>
  348. <span class="info">
  349. <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> <i><$BlogItemAuthor$></i>
  350. <span class="fa fa-comments"></span>
  351. <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> komment</a>
  352. </span>
  353. </center>
  354. <hr><$blogitembody$></div>
  355. </blogger>
  356. <br>
  357. <center><OlderPosts><a href=<$OlderPosts$>>  Régebbi posztok <span class="fa fa-chevron-right"></span></a> </OlderPosts> &nbsp;|&nbsp; <NewerPosts>  <a href=<$NewerPosts$>> <span class="fa fa-chevron-left"></span> Újabb posztok</a></NewerPosts></center>
  358. </div></div></div>
  359. </div>
  360.  
  361. <!------- FELUGRÓ ABLAKOK TARTALMA ------->
  362. <!------------------- FELUGRÓ ABLAK: #ISMERJMEG ------------------>
  363. <div style="display: none; width: 500px!important; margin-top: -139px; margin-left: -240px;" id="02" class="popup_block">
  364. <center><div class="name"> ki rejtőzik a monitor mögött? </div><br>
  365. <div class="line"></div></center>
  366. <br>
  367. Töltsd ki ezt az ürességet itt egy frappáns bemutatkozóval. Alapadataid, mióta blogolsz, miket szeretsz, miket utálsz, stb. Írhatsz összefüggő mondatokat, de akár pontokba is szedheted bemutatkozódat.<br>
  368. <div align="left">
  369. <p><img align="left" src="https://goo.gl/o2dYk9" width="40%">
  370. ◦ becses nevem ... de szólíts csak ...<br>
  371. ◦ ... éves vagyok<br>
  372. ◦ szeretem ...<br>
  373. ◦ utálom ...<br>
  374. ◦ kedvenc ...<br>
  375. ◦ álmaim ...<br>
  376. ◦ szeretnék eljutni ...<br>
  377. ◦ megtalálhatsz itt és itt is ...<br>
  378. </p>
  379. </div></div>
  380.  
  381. <!------------------- FELUGRÓ ABLAK: #MINDENEGYÉB ------------------>
  382. <div style="display: none; width: 500px!important; margin-top: -139px; margin-left: -240px;" id="01" class="popup_block">
  383. <center><div class="name"> extra menüpont </div><br>
  384. <div class="line"></div></center>
  385. <br>
  386. Írj ide, amit csak akarsz. Példának okáért itt egy linklista, de ha szeretnéd, lecserélheted másra.
  387. <br><br>
  388. <div style='float:left; width:40%'>
  389. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  390.  
  391. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  392.  
  393. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  394.  
  395. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  396.  
  397. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  398. </div>
  399.  
  400. <div style='float:left; width:40%; margin-left:50px'>
  401. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  402.  
  403. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  404.  
  405. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  406.  
  407. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  408.  
  409. <img src="https://goo.gl/EEyaoi"><a href="LINKHELYE"> Minta szöveg </a><br><br>
  410. </div>
  411.  
  412. </div></div>
  413.  
  414. <!------------------- FELUGRÓ ABLAKOK TARTALMÁNAK VÉGE ------------------>
  415.  
  416. </body>
  417. </html>
  418.  
  419. <!---------------------- ez egy javascript kód, ami a felugró ablakok működéséért felelős (ne töröld) -------------------!>
  420. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  421. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  422. <script>
  423.    (function($){
  424.        $(document).ready(function(){
  425.            $("[title]").style_my_tooltips({
  426.                tip_follows_cursor:true,
  427.                tip_delay_time:100,
  428.                tip_fade_speed:300
  429.            }
  430.                );
  431.        });
  432.    })(jQuery);
  433. </script>
  434.  
  435. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  436. <script>
  437. $(document).ready(function() {
  438. //
  439. $('a.poplight[href^=#]').click(function() {
  440. var popID = $(this).attr('rel'); //Get Popup Name
  441. var popURL = $(this).attr('href'); //Get Popup href to define size
  442. var query= popURL.split('?');
  443. var dim= query[1].split('&');
  444. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  445. -$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="https://4.bp.blogspot.com/-IjZjLD4VaIc/WMjwivUr5oI/AAAAAAAAAvs/iew7-VDcQF8j-g1TPyUxeo6y7o4iGRZKgCLcB/s1600/x2.png" display="none" class="btn_close"/></a>');
  446. var popMargTop = ($('#' + popID).height() + 80) / 2;
  447. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  448. //Apply Margin to Popup
  449. $('#' + popID).css({
  450. 'margin-top' : -popMargTop,
  451. 'margin-left' : -popMargLeft
  452. });
  453. $('body').append('<div id="fade"></div>');
  454. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  455. return false;
  456. });
  457. $('a.close, #fade').live('click', function() {
  458. $('#fade , .popup_block').fadeOut(function() {
  459. $('#fade, a.close').remove(); //fade them both out
  460. });
  461. return false;
  462. });
  463. });
  464. </script>
  465.  
  466. <!---------------------- legyen szép napod! ♡ -------------------!>
RAW Paste Data
Top