Показ дописів із міткою Блогування. Показати всі дописи
Показ дописів із міткою Блогування. Показати всі дописи

суботу, 2 травня 2020 р.

Як додати twitter card до блогу (blogger)

По замовчуванню коли твітнути статтю на платформі blogger, то в twitter з'являється не дуже привабливий tweet. Це можна виправити налаштувавши на нашому блозі twitter card (карточку твітера). 

Це можна зробити кількома способами. Спосіб один заходимо в налаштування блогу Тема/Редагувати html і додаємо такі рядки перед тегом </head> :

<meta content='summary_large_image' name='twitter:card'/>
<meta content='@your-name' name='twitter:site'/>
<meta content='@your-name' name='twitter:creator'/>

Інший спосіб надає більш розширенні можливості, зокрема можна вказали посилання на logo, яке буде з'являтися коли постити не пост, а головну сторінку, або сторінки блогу на blogger. Так же само додаємо наступний текст (взято тут):

<!--Twitter Card-->
<b:if cond='data:blog.pageType == "index"'> <!--homepage-->
    <meta name="twitter:card" content="summary" />
    <meta name="twitter:description" expr:content='data:blog.metaDescription' />
    <meta name="twitter:title" expr:content="data:blog.pageTitle" />
    <meta name="twitter:site" content="@username" />
    <meta name="twitter:image" content="YOUR_LOGO_URL" />
    <meta name="twitter:creator" content="@username" />
</b:if>
<b:if cond='data:blog.pageType == "static_page"'> <!--page-->
    <meta name="twitter:card" content="summary" />
    <meta name="twitter:description" expr:content='data:blog.metaDescription' />
    <meta name="twitter:title" expr:content="data:blog.pageTitle" />
    <meta name="twitter:site" content="@username" />
    <meta name="twitter:image" content="YOUR_LOGO_URL" />
    <meta name="twitter:creator" content="@username" />
</b:if>
<b:if cond='data:blog.pageType == "item"'> <!--blog post-->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:description" expr:content='data:blog.metaDescription' />
    <meta name="twitter:title" expr:content="data:blog.pageName" />
    <meta name="twitter:site" content="@username" />
    <meta name="twitter:image" expr:content="data:blog.postImageUrl" />
    <meta name="twitter:creator" content="@username" />
</b:if>
<!--End Twitter Card-->
@username заміняємо на власний логін на твітері.
Переглянути результат можна використавши Twitter card validator.

Інколи не завжди з першого разу карточка нормально відображається в твітері і потребується повторний твіт. Або ж спочатку необхідно переглянути на валідаторі карточки, а згодом твітнути в твітері. Результат виглядає в моєму випадку так:

: twitter card

суботу, 25 квітня 2020 р.

Покращені коментарі під статтями Blogger (Blogspot)

Стандартне здійснення коментарів в даний час на Blogger доволі незручне. Це можна покращити за допомогою плагіна від disqus.com. Встановлення доволі просте і показане на наступному відео.


Математичні формули на Blogger (LaTeX)

LaTeX формули на blogger (blogspot)
Якщо на блозі необхідне відображення формул, то можна або додавати формули рисунками або ж залучити підтримку LaTeX до свого блогу. Для цього необхідно додати відповідний скрипт до нашого блогу.

Спосіб один, додаємо в режимі редагування HTML (Тема/Редагувати HTML) в середині тегу head наступні рядки:

<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js">
MathJax.Hub.Config({
 extensions: ["tex2jax.js","TeX/AMSmath.js","TeX/AMSsymbols.js"],
 jax: ["input/TeX", "output/HTML-CSS"],
 tex2jax: {
     inlineMath: [ ['$','$'], ["\\(","\\)"] ],
     displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
 },
 "HTML-CSS": { availableFonts: ["TeX"] }
});
</script> 
Далі можемо використовувати наші формули написані у форматі LaTex:
x=x^{2}+\frac{a}{b}
Формулу необхідно оточити знаками долара і вуаля: $x=x^{2}+\frac{a}{b}$

Інший спосіб використати рішення від latex.codecogs.com. В даному випадку код з адресою скрипта додаємо у HTML/JavaScript гаджет, що наявний у блозі на платформі blogger(blogspot):
<script type="text/javascript" src="http://latex.codecogs.com/latexit.php?p&li&div></script>
При використанні цього рішення формули необхідно додатково розмістити в теги абзацу або списку: <p>...</p> та <li>...</li>.

Крім того, для тих хто не хоче особливо заморочуватися з синтаксисом LaTeX на даному сайті є відповідний графічний редактор формул, який сформатує нам формулу у форматі LaTeX: www.codecogs.com/latex/eqneditor.php

Перше рішення мені більше сподобалось, оскільки код від latex.codecs.com викликав деякі проблеми із відображенням одного з моїх лічильників на блозі.

пʼятницю, 17 квітня 2020 р.

Підсвітка синтаксису на Blogger (google-code-prettify)

Свого часу написав статтю про підсвітку синтаксису для блогів на платформі Blogger (blogspot.com): Підсвітка синтаксису на Blogger. Підсвітка від Алекса Горбачева получалась доволі красивою з реалізацією під різні мови, проте доволі часто через завантажування скриптів блог починав підвисати і час його завантаження збільшився. Тому вирішив відмовитися від неї і користуватися тегом pre. Проте хочеться все ж хоч якось прикрасити код) Тому знайшов інший вихід скрипти google-code-prettify.

Як і в попередньому випадку заходимо в управління блогом, знаходимо пункт "Тема" і тиснемо кнопку "Редагувати HTML" і там перед тегом <head> або ж після нього вставляємо:
<script src='https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js'/>
В html коді нашої статті оточуємо програмний код тегами pre:
<pre class="prettyprint">наш програмний код</pre>
або ж з вказанням мови
<pre class="prettyprint lang-html">
наш код
</pre>
Дивіться також давнішу публікацію:

четвер, 13 листопада 2014 р.

Перенаправлення blogger-блогу на інший сайт або інший блог

Суть, потрібно блог на блогері (зокрема, там знаходиться і даний блог) перенеправити на інший сайт або ж на інший блог на цій же платформі . Щоб це зробити необхідно додати відповідні рядки у HTML код блогу.

Для цього на сторінці управління блогом спочатку заходимо у Шаблон, а далі натискаємо кнопку Редагувати HTML.


четвер, 1 листопада 2012 р.

Як розкрутити свій сайт (блог)

І так ви завели сайт чи блог. Як же зробити його популярним? Адже, якщо це комерційний проект, наприклад, інтернет магазин, то від кількості відвідувачів залежать ваші продажі. Якщо ви ведете блог і хочете заробляти на рекламі, то від кількості кліків залежить прибуток. А кількість кліків напряму залежить від відвідованості. Навіть, якщо ви ведете блог задля задоволення, то все ж хочеться, щоб його читали побільше людей. Зокрема, потрібно, щоб ваш сайт чи блог видався на першій, максимально на другій сторінці пошуку.

1. Перш за все зареєструйтесь в пошукових системах. Звичайно зараз пошуковики швидко знаходять нові сайте, проте інколи буває, що доходять до нього і через пів року і через рік.


2. Наповніть сайт якомога більшою кількістю публікацій. Від кількості публікацій залежить ваша відвідуваність. І це повинно бути не кілька десятків і навіть не сотня, дві, а біля тисячі і більше. Ви можете їх писати самі, а можете взяти інформацію звідкись. Так чи інакше, якщо ваша мета саме відвідуваність наповнюйте і наповнюйте. Якщо це інтернет-магазин, то передусім наповніть сайт інформацією про товари. Не даремним буде виставлення різноманітної цікавої інформації, що якось стосується вашого магазину.

3. Зареєструйтесь на сайтах реєстраторах, на яких можна завестися лічильником відвідуваності. На зразок: http://top.topua.net/ . Власне самі лічильники вам і не сильно потрібні, але дані сайти можуть приводити до вас додаткових відвідувачів. Плюс вони міститимуть посилання на ваш сайт, а чим більше посилань на ваш сайт тим краще. Їх часто враховують пошуковики, та й без того можуть приводити кілька відвідувачів вдень.

4. Проставте посилання на ваш сайт на кількох інших сайтах, форумах, обговореннях. Де тільки зможете. Звичайно, що занадто спамити не потрібно, а то ще попадете в чорний список. Але хоча б кілька десятків помістіть.

5. Не зайвим буде сервіс від google: гугл вебмастер,  сервіс дозволяє стежити за станом вашого сайту, вести статистику відвідуваності окремих публікацій та звідки заходять, покращити індексацію вашого сайту, знаходити деякі проблеми. Іншим сервісом для власників сайтів від гугл є Гугл Аналітика Аналогічні сервіси доступні і в інших пошукових системах. Якщо не шкода грошей, то можна також провести рекламну компанію, наприклад, з допомогою Google AdWords.

6. По можливості проставте побільше ключових слів на ваших сторінках. Додавайте теги та мітки. Адже одним з критерієм від якого залежить рейтинг вашого сайту в пошуці є частота входження певних слів.

7.  Розміщуйте інформацію про нові товари чи статті в соціальних мережах. Благо є різноманітні сервіси, які роблять це автоматично через натиснення однієї кнопки, Like, facebok, twitter і т.п. Обов'язково розмість такі кнопки у ваших статтях, щоб читачі самі поширювали інформацію про вас.

8. І саме головне не очікуйте, що якщо ви це все зробили за один день, до вас хлине маса відвідувачів уже завтра, пошуковикам  і користувачам потрібний певний час на те, щоб полюбити вас:). Розкрутка сайту - це постійний процес. Звичайно ви можете його розкрутити через спам на форумах, проте така слава скороминуча. Найкращим вирішенням є все ж наповнення сайту різноманітною інформацією на популярну тематику. Ряд пошуковиків ведуть статистику популярності запитів та й ви самі швидко побачити, які теми цікавлять більше ваших читачів. Нехай щастить!


неділю, 15 січня 2012 р.

Як створити блог. Де завести?

Зацікавилися блогами і блогуванням. Тоді ця стаття для Вас. Як показує власний досвід переважно більшість блогерів проходять наступну еволюцію:

  1. виникає бажання щось написати і розмістити де небуть
  2. виникає бажання створити повноцінний блог з власним інтерфейсом та інтернет адресою
  3. виникає бажання заробити на блозі


Якщо ви просто хочете писати статті не переживати про оформлення вашого блогу, то тут вибір доволі обширний, багато сайтів запрошують авторів до співпраці заради наповнення власного вмісту і навіть блогери практикують таке, оскільки самому писати статті і розкручувати блог доволі трудомістка задачі. Можна завести блог наприклад на Живому журналі (http://www.livejournal.com). Якщо ви цікавитися політикою можна писати на (http://politiko.ua).   Але рано чи пізно, ви скоріше за все задумаєтеся створити повноцінний блог із своїм оформлення, або ж навіть з метою заробітку. Тут уже потрібно більш серйозніше підійти до справи. І тут у вас два шляхи:

1) безкоштовний блог
2) платний блог

Другий варіант дає найбільшу свободу, але одночасно і найбільш трудомістий. Ви наприклад можете створити повністю блог з нуля придбавши місце на котромусь сервері та інтернет адресу, потім або написати його самому або використати якусь із популярних систем керування вмістом (CMS) з готовими шаблонами (Wordpress, Joomla, Drupal ). Якщо вам звичайно це не лякає і вам не шкода 400-500 грн в рік, то вперед. Але здебільшого викинути таку суму зразу ж шкода. Цей варіант найбільш прийнятний для досвідчених блогерів і коли ви впевнені, що Ваш блог приноситиме відчутну користь Вам. Існують і доволі непогані сервіси платних блогів за невелику ціну. Проте, якщо ви просто хочете спробувати вести свій блог, то можна обійтися цілком і безплатними сервісами.

В інтернеті ви зустрінете чимало статей з розповідями як створити блог на конкретному ресурсі. Проте, чимало таких статей часто пишуть власники цих же самих місць, з метою приваблення потенційних клієнтів. Крім того здебільшого при створені блогу перед вами ставлять певну вимогу, наприклад, що на ваших блогах буде обов'язкова реклама або прийдеться платити за певні додаткові можливості. Особливо такі обмеження стають відчутні при спробі заробити на власному блозі. Тому при вибору місця розміщення вашого блогу зверніть увагу на обмеження, платні послуги і чи маєте ви доступ до початкового коду сторінки або чи ви хоча б можете запускати ДжаваСкрипти і в яких місцях їх розміщувати.  Адже при розміщенні реклами, наприклад, від Google AdSense вам прийдеться розміщувати невеликий JavaScript у місці появи рекламного банера.  Інколи Вас можуть і не попереджувати про певні обмеження, проте після написання кількох дописів ви можете виявити ці обмеження.  В такому випадку сміло заводьте блог на іншому ресурсі. Буде дуже школа, коли ви потратите кілька місяців, розкрутити власний блог до пів тисячі відвідувань в день, вирішите монетизувати свій блог, а тоді виявиться, що вам бракує вільного місця для нових дописів, або ви не можете розмістити рекламу і за це потрібно платити. Сам на власній шкурі пережив таке..

Випробувавши кілька безкоштовних місць для ведення блогу, можу заявити, що найкращими для цього є wordpress.com та blogger.com.  Щоправда на wordpress.com заборонено розміщувати рекламу при безплатному сервісі. Проте там практично відсутні обмеження, плюс ви освоїте можлиовсті однієї з найпотужніших систем керування вмістом Wordpress, яку можна окремо поставити на власному хостінгу і плюс якої велика кількість готових шаблонів сайтів. Тому для тих хто не планує заробляти на блозі, це найкращий варіант. Особливо для інформаційних ресурсів.

Другий варіант - blogger.com від компанії google, поступається wordpress.com в плані зручності. Проте великим плюсом є можливості встановлення реклами, наявність шаблонів хоч і не такої кількості як на wordpress, проте їх можна налаштувати під власні смаки і головне є доступ до початкового коду і можливість запускання JavaScript, відсутні чужі рекламні банери. Для першого блогу для заробітку доволі хороший варіант, де ви зможите освоїти усі аспекти блогінгу від створення до розкрутки і монетизації.

В наступній статті я розкажу як створити і налаштувати блог на blogger.com.

четвер, 29 грудня 2011 р.

Підсвітка синтаксису на Blogger.com

Вирішив я попробувати блогерського щастя на blogger.com. Отримав красивий URL з закінченням blogspot.com і почав створювати статті. Перша ж незручність - це відсутність підсвітки синтаксису коду програм. Почав шукати як підключити, знайшов, проте коли почав експериментувати, чомусь ряд прикладів зі встановлення не запрацювало. Частково мабуть через те, що деякі статті були погано розписані, частково мабуть через те, що я не до кінця зрозумів як. Тут я вирішив навести, те, що в мене без проблем вийшло і запрацювало.

Перше, що я знайшов, як дещо покращити зовнішній вигляд коду задавши стиль для тегу <pre>. Для цього достатньо в оригінальний код додати наступний код:
pre {
  background-color:#FCFBF8;
  border-color:#CCCCCC;
  border-style:solid;
  border-width:1px 1px 1px 1px;
  line-height:1.2em;
  margin:1em auto;
  overflow:auto;
  padding:1em;
  width:90%;
  word-wrap:normal; /* IE Fix */
}

Я це зробив за допомогою переходу на Шаблон/Налаштування/Додатково у списку знаходемо "Додайте CSS". Додаємо і зберігаємо. Можна також вставити і напряму в код шаблону. Тепер усе, що треба це взяти наш код у тег <pre>. Одержуємо код в рамочці із смугами прокрутки, а хотілося б все ж підсвітку синтаксису.

Тому наступні мої пошуки привели до наступного способу. Заходимо в пункт "Шаблон" і тиснемо кнопку "Редагувати HTML" і там перед тегом <head> вставляємо:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'></script> 

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script> 

<script language='javascript'> 

SyntaxHighlighter.config.bloggerMode = true;

SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';

SyntaxHighlighter.all();

</script>
Для пришвидшення завантаження сторінки в браузері можна викинути деякі рядки з мовами, які Ви не збираєтесь використовувати. Якщо потрібно лише кілька мов, викидаємо зайві рядки. Тепер обрамляємо наш текст тегами <pre> з вказанням відповідної мови:

<pre class="brush: html">

</pre> 

Дивіться також: