Найти в HTML </ тело> и вставить перед ним скрипт
плавного подъема наверх
плавного подъема наверх
<b:include name='feedLinks'/>
data:post.authorи вот этот скрипт:
<div class='post-footer'>-Чтобы изменить имя автора просто заменить строчку :
<div class='post-footer-line post-footer-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
data:post.authorна то как вы хотите чтобы вы были подписаны после статей в независимость от имени в вашем профиле. Например заменить его на АДМИН.
data:top.authorLabelна желаемую фразу.
<data:top.authorLabel/> <data:post.author/>на следующую:
<a href="Адрес вашего блога"><img src="Адрес вашей картинки" /></a>Так что конечный скрипт будет выглядеть примерно так:
<div class='post-footer'>Вот такие вот хитрости. Надеюсь вам пригодятся.
<div class='post-footer-line post-footer-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<a href="Адрес вашего блога"><img src="Адрес вашей картинки" /></a>
</b:if>
</span>
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
Enter your username and password to enter your Blogger Dasboard <br/><br/><form action="https://www.google.com/accounts/ServiceLoginBoxAuth" method="post" onsubmit="onlogin()"><input value="http://www.blogger.com/loginz?d=%2Fhome&p=http%3A%2F%2Fwww.blogger.com%2F" name="continue" type="hidden"/><input value="blogger" name="service" type="hidden"/><input value="8" name="nui" type="hidden"/><input value="8" name="naui" type="hidden"/><input value="2" name="fpui" type="hidden"/><input value="3" name="uilel" type="hidden"/><input value="true" name="skipvpage" type="hidden"/><input value="false" name="rm" type="hidden"/><input value="true" name="alwf" type="hidden"/><input value="http://www.blogger.com/login.g" name="roeu" type="hidden"/><input value="0" name="alinsu" type="hidden"/><input value="WbQ8QiJfUvA" name="GA3T" type="hidden"/><div><label for="Email"> Username: <br/><input id="Email" tabindex="1" value="" name="Email" size="20" type="text"/></label></div><div><label for="Passwd"> Password: (<a href="https://www.blogger.com/forgot.g" target="_top" title="Forgot your password?">?</a>) <br/></label><input id="Passwd" tabindex="2" autocomplete="off" name="Passwd" size="20" type="password"/></div><br/><input id="signin-btn-ns" tabindex="0" value="Sign in" class="ubtn ubtn-block" name="submit" type="submit"/></form>
<div class='titlewrapper'>
<h1 class='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</h1>
</div>
]]></b:skin>И сразу перед ним вставляем следующий код:
/* Blogger Zoom Gallery By AllBlogTools.com */Далее находим этот тэг:
ul.thumb {
float: left;
list-style: none;
margin: 0; padding: 10px;
width: 360px;
}
ul.thumb li {
margin: 0; padding: 5px;
float: left;
position: relative; /* Set the absolute positioning base coordinate */
width: 110px;
height: 110px;
}
ul.thumb li img {
width: 100px; height: 100px; /* Set the small thumbnail size */
-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
border: 1px solid #ddd;
padding: 5px;
background: #f0f0f0;
position: absolute;
left: 0; top: 0;
}
ul.thumb li img.hover {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw0eE8m3L7XQmmgNcig1ray-g_QCUc4onnp951_sL1L8sw-ftqOfivxhXoQRqIQVfqMnkwvG4fLtRDcIW8VWdtLF3OvIXcapSnmer2W7manxQGvwBlPlbvIQbJ6_1dfqX1gurLRJYHSdMR/) no-repeat center center; /* Image used as background on hover effect
border: none; /* Get rid of border on hover */
}
</head>Добавьте следующий скрипт перед ним:
<script src='http://code.jquery.com/jquery-latest.js'Теперь нажмите сохранить изменения.
type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Larger thumbnail preview
$("ul.thumb li").hover(function() {
$(this).css({'z-index' : '10'});
$(this).find('img').addClass("hover").stop()
.animate({
marginTop: '-110px',
marginLeft: '-110px',
top: '50%',
left: '50%',
width: '174px',
height: '174px',
padding: '20px'
}, 200);
} , function() {
$(this).css({'z-index' : '0'});
$(this).find('img').removeClass("hover").stop()
.animate({
marginTop: '0',
marginLeft: '0',
top: '0',
left: '0',
width: '100px',
height: '100px',
padding: '5px'
}, 400);
});
//Swap Image on Click
$("ul.thumb li a").click(function() {
var mainImage = $(this).attr("href"); //Find Image Name
$("#main_view img").attr({ src: mainImage });
return false;
});
});
</script>
<ul class="thumb">в этом скрипте указываем ссылки к вашим картинкам, вместо # можно вставить адрес страницы на которую вы хотите чтобы переходил посетитель после нажатия на картинку. Количество картинок не ограничено, просто добавляйте строчку
<li><a href="#"><img src="ссылка на картинку 1" alt="" /></a></li>
<li><a href="#"><img src="ссылка на картинку 2 " alt="" /></a></li>
<li><a href="#"><img src="ссылка на картинку 3" alt="" /></a></li>
<li><a href="#"><img src="ссылка на картинку 4" alt="" /></a></li>
</ul>
<li><a href="#"><img src="ссылка на картинку 1" alt="" /></a></li>сколько необходимо раз.
<script language='JavaScript'>
//
alert ("Это текст всплывающего окна")
</script>
<div class="green-page">
...Тело поста...
</div>
.green-page { background-color:#9FFFA3; } .green-page a, .green-page a:link { color: #076F0B; } .green-page a:visited { color: #3E8F42; } .green-page img { border:1px solid #076F0B; }
<b:includable id='post' var='post'> <div class='post hentry'>
<div class='post hentry' expr:id='"rb"+data:post.id'>
<div id="rb2861954547900697711" class="post hentry"> ... </div>
"rb2861954547900697711"
. Этот идентификатор сообщения ты теперь можешь использовать для привязки стилей.<div class="green-page"> <style type="text/css"> div#rb2861954547900697711 {background-color:#EFFFEF; padding: 15px 10px;} div#rb2861954547900697711 h3 a {color: #076F0B;} </style> ...Тело сообщения... </div>
<style type="text/css"> ... </style>
class="green-page"
) так и локальные стили (заданные для каждого сообщения отдельно).