Что такое Blogger.com (Blogspot) : Почему стоит выбрать Blogger?

Зачем создавать блог на платформе Blogger?

Blogger — это одна из самых эффективных платформ для публикации вашего блога. Блоги размещаются компанией Google на поддомене blogspot.com. Вы можете создавать до 100 блогов на одну учетную запись...

История и статистика блоггер

• 23 августа 1999 года Pyra Labs запустила Blogger. В феврале 2003 года Pyra Labs была приобретена Google. Это сделало многие функции Blogger.com бесплатными!
• В 2004 году Google приобрела Picasa, чтобы пользователям было где хранить фотографии и файлы  своих блогов.
• Май 2004 года Blogger представил масштабную реконструкцию, добавив такие функции, как шаблоны, соответствующие веб-стандартам, отдельные страницы архива для сообщений, комментариев и отправки сообщений по электронной почте.
• 14 августа 2006 года Blogger выпустил свою последнюю версию в бета-версии под кодовым названием «Invader» вместе с золотым релизом. Добавились некоторые новые функции, включая дополнительные языки интерфейса.
• Blogger занял 16-е место в списке 50 лучших доменов по количеству уникальных посетителей в 2007 году.
• В 2020 году Blogger изменил интерфейс административной панели.

Причины выбрать Blogger

1. Blogger — это бесплатная платформа для ведения блогов.
2. В панели управления есть конструктор тем, в котором вы можете легко задать ширину столбцов, изменить стиль заголовка, фон, цвета и многое другое. 
3. Удобный HTML редактор текста. 
4. В разделе Темы   можно добавить любую понравившуюся вам, в зависимости от тематики блога!
5. Получаете бесплатный домен.
6. Нет дополнительных затрат на покупку хостинга. Вы можете сразу публиковать свой блог в интернете!
7. Техподдержка работает круглосуточно!

Можно ли загрузить свой шаблон на Blogger? Как загрузить шаблон на Blogger?

— Голубоглазая юристка

 

👉❓Блог-платформа Blogspot поддерживает шаблоны в формате *.xml!
 При обновлении шаблона могут пропасть некоторые виджеты (связанно из-за разной структуры нового и старого шаблонов).
Чтобы, установить новый шаблон его нужно предварительно скачать, в интернете можно найти бесплатные шаблоны.
Например:Koenda-Blogger-Template.zip (Так будет выглядеть скачанный файл Темы)

👉❓Если, хотите "переделать свой  Шаблон в сайт  согласно общепринятым правилам оптимизации", то задавайте мне вопросы в комментариях❗ 
 Пример см. По секрету всему свету на основе Темы Watermark❗ 

Можно ли загрузить свой шаблон на Blogger? Как загрузить шаблон на Blogger?

Да, можно загрузить свой шаблон на Blogger.

Для этого выполните следующие шаги:

1.  Скачайте нужный вам шаблон из интернета (в виде zip-файла)
2. Теперь распакуйте этот zip-файл с помощью такой программы, как Winzip
3. Войдите в панель управления Blogger
4. Нажмите на название блога
5. Перейдите на вкладку «ТЕМА» > «НАСТРОИТЬ» > «ВОССТАНОВИТЬ»
6. Откроется такая вкладка 
   
   
   
   
   
   
   
7.  Загрузите ваш  шаблон с помощью кнопки  «Загрузить»
8. Выберете распакованный шаблон файла у себя на компьютере в формате *xml и нажмите «Открыть»
9. Подождите несколько секунд, пока загрузка не завершится (Появиться сообщение: Восстановление темы...  Тема восстановлена) 
   
   
10. Вы успешно установили новый шаблон Blogger

Читать полностью →

Улучшение звука для ПК: Виртуальная звуковая карта

Как увеличить громкость звука на компьютере

FxSound (ранее DFX Audio Enhancer) - отличное приложение, которое позволяет существенно улучшить качество звука в различных приложениях...

Что такое FxSound?

FxSound (ранее известна как DFX) — это программа с открытым исходным кодом для цифровой обработки звука, которая была загружена более 50 млн раз с 1999 года.
Чтобы сделать высококачественное звучание более доступным, в 2022 году FxSound стала полностью бесплатной.

Настройки компьютера для работы после установки программы

После установки, нажмите клавиши Win+I → Система → Звук → Выберите устройство вывода → DFX Speakers.

Затем в панели управления звуковым драйвером (Пуск → Панель управления → Оборудование и звук → Звук) нужно проверить, чтобы была активна настройка как на картинке ниже.

👉❓ Примечание. Программу качаем на официальном сайте FxSound. Теперь она абсолютна бесплатна.

Один из лучших звуковых эквалайзеров для Windows, прост в настройках! Обязательно попробуйте, почувствуйте разницу! Больше никакого хрипа из динамиков! Последнее обновление работает даже с Dolby Atmos ! Удивительно, но эта программа отлично подходит и для установки на ноутбуки!

— Michail, 3/23/2024 

Читать полностью →

Как добавить нумерацию страниц в Blogger: Как изменить навигацию в блоге

Постраничная навигация для Blogger

Пагинация — это нумерация страниц по возрастанию, которую используют на сайте для последовательного отображения контента. Разбивка по страницам или навигация по страницам, не встроена в Blogger, но ее можно реализовать с помощью простого кода. Основная цель — для удобства навигации пользователей. Ее просто и легко интегрировать, а стиль можно изменить по вашему желанию...

Установка скрипта "следующая/предыдущая" в свой блог

1. Перейдите  «ТЕМА» > «НАСТРОИТЬ» > «РЕДАКТИРОВАТЬ HTML»
2. Теперь найдите тег </body> и вставьте перед ним приведенный ниже код.

<script type='text/javascript'>;
var home_page=&#39;/&#39;;
var urlactivepage=location.href;
var postperpage=4;
var numshowpage=4;
var upPageWord =&#39;Prev&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script type='text/javascript'>
//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('6 I;6 i;6 f;6 n;1f();C 1g(15){6 5=\'\';J=K(N/2);4(J==N-J){N=J*2+1}A=f-J;4(A<1)A=1;d=K(15/j)+1;4(d-1==15/j)d=d-1;D=A+N-1;4(D>d)D=d;5+="<3 7=\'1A\'>1B "+f+\' 1C \'+d+"</3>";6 16=K(f)-1;4(f>1){4(f==2){4(i=="o"){5+=\'<3 7="1D"><a 9="\'+B+\'">\'+O+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">\'+O+\'</a></3>\'}}b{4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+16+\');w x">\'+O+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+16+\');w x">\'+O+\'</a></3>\'}}}4(A>1){4(i=="o"){5+=\'<3 7="g"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}4(A>2){5+=\' ...    \'}1h(6 l=A;l<=D;l++){4(f==l){5+=\'<3 7="1E">\'+l+\'</3>\'}b 4(l==1){4(i=="o"){5+=\'<3 7="g"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}b{4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+l+\');w x">\'+l+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+l+\');w x">\'+l+\'</a></3>\'}}}4(D<d-1){5+=\' ...  \'}4(D<d){4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+d+\');w x">\'+d+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+d+\');w x">\'+d+\'</a></3>\'}}6 17=K(f)+1;4(f<d){4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+17+\');w x">\'+1i+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+17+\');w x">\'+1i+\'</a></3>\'}}5+=\'<1j><a 9="1F://1G.1H-1k.1I" 1J="1K-1L: 1M; 1N: 1O; 1P: 1Q;" 1R="1S">1T 1U 1V-1k</a></1j>\';6 E=y.1W("E");6 18=y.1X("1Y-1Z");1h(6 p=0;p<E.P;p++){E[p].1l=5}4(E&&E.P>0){5=\'\'}4(18){18.1l=5}}C 1a(Q){6 R=Q.R;6 1m=K(R.21$22.$t,10);1g(1m)}C 1f(){6 h=u;4(h.e("/r/s/")!=-1){4(h.e("?S-c")!=-1){n=h.F(h.e("/r/s/")+14,h.e("?S-c"))}b{n=h.F(h.e("/r/s/")+14,h.e("?&c"))}}4(h.e("?q=")==-1&&h.e(".5")==-1){4(h.e("/r/s/")==-1){i="o";4(u.e("#G=")!=-1){f=u.F(u.e("#G=")+8,u.P)}b{f=1}y.1n("<m T=\\""+B+"U/V/W?c-k=1&X=Y-Z-m&11=1a\\"><\\/m>")}b{i="s";4(h.e("&c-k=")==-1){j=20}4(u.e("#G=")!=-1){f=u.F(u.e("#G=")+8,u.P)}b{f=1}y.1n(\'<m T="\'+B+\'U/V/W/-/\'+n+\'?X=Y-Z-m&11=1a&c-k=1" ><\\/m>\')}}}C L(H){12=(H-1)*j;I=H;6 13=y.1o(\'1p\')[0];6 z=y.1q(\'m\');z.1r=\'1s/1t\';z.1u("T",B+"U/V/W?1v-1w="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1x(z)}C M(H){12=(H-1)*j;I=H;6 13=y.1o(\'1p\')[0];6 z=y.1q(\'m\');z.1r=\'1s/1t\';z.1u("T",B+"U/V/W/-/"+n+"?1v-1w="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1x(z)}C 1b(Q){1c=Q.R.24[0];6 1y=1c.1z.$t.F(0,19)+1c.1z.$t.F(23,25);6 1d=26(1y);4(i=="o"){6 1e="/r?S-c="+1d+"&c-k="+j+"#G="+I}b{6 1e="/r/s/"+n+"?S-c="+1d+"&c-k="+j+"#G="+I}27.9=1e}',62,132,'|||span|if|html|var|class||href||else|max|maksimal|indexOf|nomerhal|showpageNum|thisUrl|jenis|postperpage|results|jj|script|lblname1|page|||search|label||urlactivepage|onclick|return|false|document|newInclude|mulai|home_page|function|akhir|pageArea|substring|PageNo|numberpage|nopage|nomerkiri|parseInt|redirectpage|redirectlabel|numshowpage|upPageWord|length|root|feed|updated|src|feeds|posts|summary|alt|json|in||callback|jsonstart|nBody||banyakdata|prevnomer|nextnomer|blogPager||hitungtotaldata|finddatepost|post|timestamp|alamat|halamanblogger|loophalaman|for|downPageWord|div||innerHTML|totaldata|write|getElementsByTagName|head|createElement|type|text|javascript|setAttribute|start|index|appendChild|timestamp1|published|showpageOf|Page|of|showpage|showpagePoint|http||||style|font|size|0pt|float|right|margin|0px||||||getElementsByName|getElementById|blog|pager||openSearch|totalResults||entry|29|encodeURIComponent|location'.split('|'),0,{}))
//]]>
</script>

Добавляем стили CSS для постраничной навигации

Найдите тег </b:skin> и вставьте перед ним приведенный ниже код

.blog-pager,#blog-pager{font-family:"Times New Roman", Times, serif;font-weight:normal;font-size:12px;width:700px;padding:17px;} 
.showpageNum a,.showpage a {background:#069; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;} 
.showpageNum a:hover,.showpage a:hover {background:orange; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;}
.showpageOf{margin:0 8px 0 0;font-family:'Coming Soon', cursive;text-decoration:none;font-size:100%;}
.showpagePoint {background:orange; color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:12px 18px 12px;-moz-border-radius:36px;-webkit-border-radius:36px;border-radius:36px;}

Настройки скрипта:

• Измените postperpage=... на количество отображаемых сообщений, которые будут отображаться на Главной странице. Оно должно совпадать с числом, которое вы выбрали в разделе Дизайн  > Записи в блоге  > Количество сообщений на Главной странице.
• Измените numshowpage=... на количество страниц, которые вы хотите отображать в нумерованной навигации.
•  Вы также можете изменить значения Рrev/Next на текст, который хотите отобразить.

См.  Пример пагинации  на моем блоге

Читать полностью →

 Как добавить следующую и предыдущую нумерованную нумерацию страниц в Blogger

Платформа Blogger предоставляет своим пользователям традиционный набор элементов блога.

Читать полностью →

Меняем дизайн Google Translate : Как изменить стили переводчика Blogger

Дизайн гаджета Translate для Blogger

Виджет Google переводчик способен перевести блог на платформе blogger на большинство языков мира.
Если вам нужно, чтоб ваш блог переводился на другие языки, то для вас подойдет виджет на базе Google переводчик...

Изменим стили в Google translate на Blogger

• Создадим стильную кнопки Перевести для автоматического перевода
• Удалим ссылку на Технологии Google Переводчик
  
• Добавим CSS стили

Как добавить код виджета ?

Ваш блог →Дизайн→ Добавить гаджет→ HTML/Javascript. Скопируйте и вставьте в него весь приведенный ниже фрагмент кода.

💡Пример кода отыскался на "буржуйских" сайтах, если хотите, можете поискать другие варианты переводчика на просторах интернета. Я только внес свои небольшие изменения для того, чтоб код работал❕ Сайт с кодом Cybup Translator Widget 

Скопировать код:

<center>
<style type="text/css">/*Cybup Translator Widget */
#cybup-trans-warp {
display:block;
width:90%;
max-width:300px;
border:none;
background-color:#fff;
color:#444;
overflow:hidden;
position:relative;
height:40px;
line-height:40px;
border:1px solid #e0e0e0;
}
#cybup-trans-warp select {
border:none;
background:transparent;
font-family:'Verdana',Arial,Sans-Serif;
font-size:12px;
width:100%;
color:#444;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
-webkit-appearance:none;
cursor:text;
padding:5px 10px;
}
#cybup-trans-warp a,
#cybup-trans-warp a:hover {
display:block;
background-color:#f79d42;
border:none;
color:#fff;
margin:0 0;
text-decoration:none;
position:absolute;
top:0;
right:0;
bottom:0;
cursor:pointer;
width:14%;
transition:all 0.3s ease;
}
#cybup-trans-warp a:before {
content:"";
display:block;
width:0;
height:0;
border:6px solid transparent;
border-left-color:white;
position:absolute;
top:50%;
left:45%;
margin-top:-5px;
}
#cybup-trans-warp a:hover {opacity:0.9;}
#cybup-trans-warp a:active {opacity:0.9;}
#cybup-trans-warp select:focus,
#cybup-trans-warp a:focus,
#cybup-trans-warp select:active,
#cybup-trans-warp a:active {
border:none;
outline:none;
cursor:pointer;
}
option {
background:#4f2323;
color:#fff;
}
</style>
<div id="cybup-trans-warp">
<select id="translate-language">

<option value="en" selected />Выбрать язык...
<option value="af" />африкаанский
<option value="sq" />албанский
<option value="ar" />арабский
<option value="hy" />армянский
<option value="az" />азербайджанский
<option value="eu" />баскский
<option value="be" />белорусский
<option value="bn" />бенгальский
<option value="bg" />болгарский
<option value="ca" />каталанский
<option value="zh-TW" />китайский (традиционный)
<option value="zh-CN" />китайский (упрощенный)
<option value="hr" />хорватский
<option value="cs" / />чешский
<option value="da" />датский
<option value="nl" />голландский
<option value="en" />английский
<option value="eo" />эсперанто
<option value="et" / />эстонский
<option value="tl" />филиппинский
<option value="fi" />Финский
<option value="fr"/>французский
<option value="gl" />галисийский
<option value="ka" / />грузинский
<option value="de" />немецкий
<option value="el" />греческий
<option value="gu" />гуджарати
<option value="ht" />гаитянский
<option value="iw" />иврит
<option value="hi" />хинди
<option value="hu" />венгерский
<option value="is" />исландский
<option value="id" />индонезийский
<option value="ga" />ирландский
<option value="it" />итальянский
<option value="ja" />японский
<option value="kn" />каннадский
<option value="ko" />корейский
<option value="la" />латинский
<option value="lv" />латышский
<option value="lt" />литовский
<option value="mk" />македонский
<option value="ms" />малайский
<option value="mt" />мальтийский
<option value="no" />норвежский
<option value="fa" />персидский
<option value="pl" />польский
<option value="pt" />португальский
<option value="ro" />румынский
<option value="ru" />русский
<option value="sr" />сербский
<option value="sk" />словацкий
<option value="sl" />словенский
<option value="es" />испанский
<option value="sw"/>суахили
<option value="sv" />шведский
<option value="ta" />тамильский
<option value="te" />телугу
<option value="th" />тайский
<option value="tr" />турецкий
<option value="uk" />украинский
<option value="ur" />урду
<option value="vi" />вьетнамский
<option value="cy" />валлийский
<option value="yi" />идиш
</select><a id="translate-me" href="#" title="Перевести"></a>
</div>
<script type="text/javascript">
(function () {
var mylang = "ru"; // Язык вашего сайта
var anchor = document.getElementById('translate-me');
anchor.onclick = function () {
var selectedLang = document.getElementById('translate-language').value;
window.open('https://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + mylang + '%7C' + selectedLang + '&hl=' + selectedLang);
return false;
};
})();
</script></center>

Читать полностью →

Как сделать карту сайта для Blogspot: Как создать страницу Sitemap в Blogger

Что такое HTML Sitemap и ее преимущества

HTML Sitemap — это страница на вашем сайте, которая описывает полную структуру вашего сайта. Она включает ссылки на все ваши страницы и записи, что упрощает навигацию для пользователей. Она полезна для ваших посетителей, помогая им легко перемещаться по вашему сайту...

1. Сканирование поисковыми системами: карты сайта помогают поисковым роботам понять структуру вашего веб-сайта и более эффективно индексировать страницы.
2. Индексация: роботы поисковых систем систематизируют собранные в процессе сканирования данные о страницах сайта.
3. Часто обновляемый контент: когда вы обновляете или добавляете новый контент, карта сайта помогает поисковым системам быстро его находить, повышая скорость индексации.

Самый простой вариант Sitemap

Карта выглядит в виде простого списка ссылок на статьи блога. Скриншот:

Как добавить карту на отдельную страницу?

• Создайте новую страницу блога, дайте название
• В режиме HTML новой страницы вставьте код карты:

  Перейти по Ссылке

Замените адрес в коде, выделенный желтым на url вашего блога 📌

👉❓ Если хотите такую карту, как у меня на странице Карта блога (три раздела: оглавление; дата публикации и ярлыки к записям), то задавайте вопросы✏️в комментариях или через форму обратной связи❕

Читать полностью →

Как отредактировать дату в Blogger : Как изменить формат заголовка даты

Как изменить стили заголовка даты публикации в Blogger

В этой статье я расскажу вам, как изменить стили заголовка даты в вашем блоге на Blogger/Blogspot. Для этого нужно добавить код  в стили заголовка даты в Blogger с помощью  свойств CSS...

Настройка стилей для заголовка даты Blogge/Blogspot

Добавляем фон к заголовку

• Перейдите в раздел «Тема»> «Настроить»> «Изменить HTML» на панели инструментов Blogger и создайте резервную копию существующего шаблона, прежде чем вносить какие-либо изменения!
• Нажмите клавиши «Ctrl+F» для поиска кода < h2.date-header {font: $(date.font); color: $(date.text.color);} > или < .date-header span > 
  (Темы Watermark и Picture Window соответственно💡)
• УДАЛИТЕ ЭТОТ КОД (в зависимости от темы💡) и добавьте другой фрагмент  (Перейти по ссылке)

Добавляем иконку Awesome к заголовку

1. Для добавления иконки  необходимо добавить ссылку в раздел заголовка сайта для того, чтобы подгружались иконки Font Awesome. 
2. Правим код, для этого нажимаем клавиши «Ctrl+F» для поиска  <data:post.dateHeader/>. Он подсветится желтым цветом. 

💡Таких кодов может быть несколько! Поэкперементируйте с каждым по очереди! 

💡На  примере  ниже  уже добавлены и иконка и правки  кода! Вставляем код вместо старого!💡

<h2 class='date-header'><span><i class='fa fa-clock' style='font-size:18px;color:red'/><data:post.dateHeader/><data:post.times/></span></h2

Читать полностью →