четверг, 10 декабря 2020 г.
вторник, 27 марта 2018 г.
суббота, 28 ноября 2015 г.
Сегодня я предлагаю Вам оценить и забрать себе на блог классный скрипт, который интерактивно сравнивает два изображения, путем наложения одного на другой. Да что рассказывать - смотрите демонстрацию работы плагина до/после. Кому пригодиться этот скрипт?
Область применения этого плагина очень широкая. Мне сразу в голову приходят бьюти блоги, то есть про макияж и одежду. Вот там можно делать мгновенное сравнение результата мейкапа или стиля одежды той или иной звезды шоу-бизнеса.Также не могут обойти стороной скрипт авторы сайтов и блогов про дизайн. Вы сможете круто показать редизайн сайта или ваше личное видение фасадного ремонта Белого дома. Вообщем, есть где разыграться.
Как установить себе в блог?
Сейчас я расскажу как установить этот скрипт сайту на платформе Blogger.1. Заходим в Панель управления и выбираем нужны блог.
2. В сайдбаре слева выбираете вкладку
Шаблон, а затем на обновившейся странице нажимаете на кнопку Изменить HTML. 
3. Кликните левой кнопкой мыши по коду в текстовом поле и нажмите CTRL+F и в том же поле с кодом должно появиться поле Search, как на картинке. В поле поиска вводим </head>.
4. Теперь когда Вы нашли этот тег, нужно перед ним вставить следующий код:
HTML
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>
<script src='http://code.jquery.com/ui/1.10.3/jquery-ui.js' type='text/javascript'/>
<script src='http://helplogger.googlecode.com/svn/trunk/jquery.beforeafter.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function(){
$('#beforeafter1').beforeAfter({showFullLinks : false});
});
</script>
Читайте также: Лучшие CSS эффекты при наведении курсора на изображение
5. Найдите строчку, где у Вас начинается стиль <b:skin> и где рядом, под информацией о шаблоне Вы встретите строчку <Variable name="maincolor" .., если ее нашли, то под этой строчкой вставьте следующий код:
<Variable name="image.background.color" description="Background Color" type="color" default="#ffffff" value="#ffffff"/> Если не нашли, то вставьте код в любое место после <b:skin>.5. Осталось сохранить шаблон и переходить к следующем пункту!
Как работать с плагином эффекта до/после?
Для начала нужно создать новое сообщение и в нужно месте разместить следующий код:<div id='beforeafter1'>
<div><img alt='before' src='URL изображение ДО' width='400' height='290'/></div>
<div><img alt='after' src='URL изображение ПОСЛЕ' width='400' height='290'/></div>
</div>
Отдельно загрузите файлы изображений в пост и скопируйте ссылки в нужное место в код сверху. Не забудьте указать свои размеры изображений.
Между прочем, если у Вас есть несколько таких сравнений, то есть отличное решение - нужно добавить всего одну строчку в код перед </head>. Нужно скопировать и изменить номер блока beforeafter. То есть был только beforeafter1, а теперь появиться beforeafter2, beforeafter3 и тд. Код для двух сравнение будет выглядеть так:
HTML
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>
<script src='http://code.jquery.com/ui/1.10.3/jquery-ui.js' type='text/javascript'/>
<script src='http://helplogger.googlecode.com/svn/trunk/jquery.beforeafter.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function(){
$('#beforeafter1').beforeAfter({showFullLinks : false});
$('#beforeafter2').beforeAfter({showFullLinks : false});
});
</script>
А страница сообщение будет иметь следующий код:
<div id='beforeafter1'>
<div><img alt='before' src='URL изображение ДО' width='400' height='290'/></div>
<div><img alt='after' src='URL изображение ПОСЛЕ' width='400' height='290'/></div>
</div>
<div id='beforeafter2'>
<div><img alt='before' src='URL изображение ДО' width='400' height='290'/></div>
<div><img alt='after' src='URL изображение ПОСЛЕ' width='400' height='290'/></div>
</div>
Теперь осталось проверить работу скрипта - посмотрите что получилось. У меня получился вот такой результат - смотрите демонстрацию работы плагина до/после . Кстати, друзья, а Вы видели новый трейлер фильма "Первый мститель: Противостояние"? Предлагаю посмотреть и уже начинать ждать эту кинокартину.
На этом всё. За скрипт спасибо CatchMyFame, а всем остальным спасибо, за то что прочитали. Ваши вопросы по работе скрипта пишите в комментах. До скорого!
пятница, 27 ноября 2015 г.
Пример 1Как Вы увидели с демонстрации, главным эффектом нашей страницы являются разные снежинки, и то как они бесконечно падают. Весь секрет в спрайте (не в напитке) и в элементе HTML5 - canvas (холст).
Наш спрайт содержит пятнадцать разнообразных снежинок, а главной их особенностью является их одинаковый размер, что очень важно при работе скрипта. Суть его работы проста: он выделяет снежинку согласно координатам и "бросает" ее, создавая эффект падающего снега на сайте.
JavaScript- код
/**Сохраните этот код в файле под названием script.js. Кстати, какой редактор Вы используете? Я ранее уже советовал три крутых редактора для вебмастера. Если сохраните спрайт себе на хостинг, то не забудьте поменять в вышеизложенном коде адрес картинки, который помечен красным, то есть это http://nwo.ucoz.ua/demo/ny/sprite.png.
*
* Скрипт новогоднего праздника xD
*
* Licensed under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*
* Идея Script Tutorials
* http://www.script-tutorials.com
*
* Адаптация
* http://www.ipetrenko.ru
*/
// canvas and context objects
var canvas, ctx;
//Snowflakes object
Snowflakes = (function () {
// sprites information
var sprCnt = 15;
var sprWidth = 80;
var sprHeight = 68;
// arrays of snowflakes and sprites
var snowflakes = [];
var snowflakeSprites = [];
// other inner params
var minScale = 0.2; // min scale for flakes
var maxScale = 1.2; // max scale for flakes
var minVerticalVelocity = 2; // min vertical velocity
var maxVerticalVelocity = 5; // max vertical velocity
var minHorizontalVelocity = -2; // min horizontal velocity
var maxHorizontalVelocity = 3; // max horizontal velocity
var minOpacity = 0.1; // min opacity
var maxOpacity = 0.9; // max opacity
var maxOpacityIncrement = 60; // opacity increment
// every flake swings in the interim between next deltas:
var minHorizontalDelta = 1;
var maxHorizontalDelta = 4;
var speed = 2; // speed
// get random number between x1 and x2
function getRandom(x1, x2) {
return Math.random() * (x2 - x1) + x1
}
// initialize sprites
function initializeSprites() {
var img = new Image();
img.onload = function () {
// fill snowflakeSprites with every sprite of sprite.png
for (var i = 0; i < sprCnt; i++) {
// create new canvas
var sprite = document.createElement('canvas');
sprite.width = sprWidth;
sprite.height = sprHeight;
var context = sprite.getContext('2d');
// and draw every sprite at this canvas
context.drawImage(img, i * sprWidth, 0, sprWidth, sprHeight, 0, 0, sprWidth, sprHeight);
// and fill array
snowflakeSprites.push(sprite);
}
}
img.src = 'http://nwo.ucoz.ua/demo/ny/sprite.png';
};
// initialize snowflakes
function initialize(number) {
// initialize sprites
initializeSprites();
// prepare a necessary amount of snowflakes
for (var i = 0; i < number; i++) {
snowflakes.push(initializeSnowflake());
}
};
// initialize snowflake
function initializeSnowflake() {
// get random scale
var scale = getRandom(minScale, maxScale);
return {
x: Math.random() * ctx.canvas.width, // x and
y: Math.random() * ctx.canvas.height, // y positions
vv: getRandom(minVerticalVelocity, maxVerticalVelocity), // vertical and
hv: getRandom(minHorizontalVelocity, maxHorizontalVelocity), // horizontal velocity
o: getRandom(minOpacity, maxOpacity), // opacity
oi: Math.random() / maxOpacityIncrement, // opacity increment
mhd: getRandom(minHorizontalDelta, maxHorizontalDelta), // maximum horizontal delta
hd: 0, // horizontal delta
hdi: Math.random() / (maxHorizontalVelocity * minHorizontalDelta), // horizontal delta increment
sw: scale * sprWidth, // scaled sprite width
sh: scale * sprHeight, // and height
si: Math.ceil(Math.random() * (sprCnt - 1)) // sprite index
}
};
// move flakes
function moveFlakes() {
for (var i = 0; i < snowflakes.length; i++) {
var osf = snowflakes[i];
// shift X and Y position
osf.x += (osf.hd + osf.hv) * speed;
osf.y += osf.vv * speed;
// swings
osf.hd += osf.hdi;
if (osf.hd < -osf.mhd || osf.hd > osf.mhd) {
osf.hdi = -osf.hdi;
};
// collision with borders
if (osf.y > ctx.canvas.height + sprHeight / 2) {
osf.y = 0
};
if (osf.y < 0) {
osf.y = ctx.canvas.height
};
if (osf.x > ctx.canvas.width + sprWidth / 2) {
osf.x = 0
};
if (osf.x < 0) {
osf.x = ctx.canvas.width
};
// toggle opacity
osf.o += osf.oi;
if (osf.o > maxOpacity || osf.o < minOpacity) {
osf.oi = -osf.oi
};
if (osf.o > maxOpacity)
osf.o = maxOpacity;
if (osf.o < minOpacity)
osf.o = minOpacity;
}
}
// render frame
function renderFrame() {
// move (shift) our flakes
moveFlakes();
// clear content
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
// draw each flake
for (var i = 0; i < snowflakes.length; i++) {
var osf = snowflakes[i];
ctx.globalAlpha = osf.o;
ctx.drawImage(snowflakeSprites[osf.si], 0, 0, sprWidth, sprHeight, osf.x, osf.y, osf.sw, osf.sh);
}
}
return {
'initialize': initialize,
'render': renderFrame,
}
})();
// main initialization
function initialization() {
// create canvas and context objects
canvas = document.getElementById('panel');
ctx = canvas.getContext('2d');
// set canvas size - fullscreen
ctx.canvas.width = window.innerWidth;
ctx.canvas.height = window.innerHeight;
// loop main scene
setInterval(Snowflakes.render, 40);
Snowflakes.initialize(100);
}
// window onload event handler
if (window.attachEvent) {
window.attachEvent('onload', initialization);
} else {
if (window.onload) {
var curronload = window.onload;
var newonload = function() {
curronload();
initialization();
};
window.onload = newonload;
} else {
window.onload = initialization;
}
}
Теперь нужно наделить дизайном нашу будущую страницу. Здесь уже ничто не касается падающего снега, а самым главным параметром является background в элементе body, так как именно он отвечает за фон нашей страницы.
CSS-код
* {
margin: 0;
padding: 0;
}
body {
overflow:hidden;
background: url("http://nwo.ucoz.ua/demo/ny/christmas_tree1.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Сохраняем этот код в файле под названием main.css. Опять таки, если захотите сохранить себе картинку или у вас будет своя - не забудьте поменять адрес изображения!А теперь нам остается лишь всё это "сложить в одну коробку". Наша страница index.html будет содержать следующий код.
HTML-код
<!DOCTYPE html>
<html lang="ru">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Новогоднее поздравление 2016 в HTML5 </title>
<link rel="stylesheet" href="http://nwo.ucoz.ua/demo/ny/main.css" type="text/css">
<script src="http://nwo.ucoz.ua/demo/ny/script.js"></script>
</head>
<body>
<canvas height="667" width="1360" id="panel">Сорян, ваш браузер не поддерживает HTML5 ;(</canvas>
</body>
</html>
Как Вы заметили, файлы index.html, main.css, script.js должны лежать в одной директории - учтите это. Вот и всё, айда смотреть результат! Кстати, а что у Вас получилось? Кидайте ссылки в комментарии ниже - посмотрим, на что у вас хватит фантазии.
До новых встреч, йо-хо-хоу
Идея Андрю, автора Script Tutorials
четверг, 26 ноября 2015 г.
Чтобы получить картину нужно подписаться на бота и отправить ему твит, где Вы должны прикрепить свое фото. Но если Вы хотите больше надстроек, то можно почитать мануал от автора Deep Forgeries.
На момент публикации этого сообщения я еще не получил свою картину. Но это понятно - очередь на такую "процедуру" уже огромнейшая благодаря вниманию соцсетей и крупных техносайтов.
Судя по результатам других пользователе процесс занимает от 20 минут до суток.
Апдейт: спустя два часа после отправки твита я получил свою картину! При ее "писании" бот использовал методы Анри Матисс. Что же вышло? Смотрите ниже первый твит ;)
@Igor_Petrenko Here’s my #DeepForgery using methods of Henri Matisse from approx. 1905. https://t.co/FRGFw2C80z pic.twitter.com/e7Hb7kwiHO
— The Deep Forger (@DeepForger) 30 ноября 2015@HammBoned Voilà my #DeepForgery avec the style of Vincent van Gogh at around 1889. https://t.co/EV2vqStGGt pic.twitter.com/lbJiYuTUyb
— The Deep Forger (@DeepForger) 30 ноября 2015@kgnkl This is my #DeepForgery avec methods from Edgar Degas from approx. 1879. https://t.co/7ojsXPsfae pic.twitter.com/LnPeI3uuLq
— The Deep Forger (@DeepForger) 30 ноября 2015@jj_ap It’s my #DeepForgery with techniques from Katsushika Hokusai at ca. 1830–32. https://t.co/QRlOS3XUre pic.twitter.com/yYKNLLS3IZ
— The Deep Forger (@DeepForger) 30 ноября 2015@Pyrofoux Voilà your #DeepForgery avec methods by Pablo Picasso from ca. 1925. https://t.co/CDjxipimi9 pic.twitter.com/FhZ6PBOHAZ
— The Deep Forger (@DeepForger) 30 ноября 2015@aanand voila my #DeepForgery with techniques of Pablo Picasso at approx. 1959–60. https://t.co/oS9cUB4QZL pic.twitter.com/uQKosK4nHC
— The Deep Forger (@DeepForger) 30 ноября 2015
Сегодня утром я получил рассылку от форума SbUP, где увидел топик о том, что партнерская система опциона Binomo - BinPartner начала мегаконкурс с бюджетом более чем 20 тысяч долларов, а может и больше будет, в зависимости от результата конкурса для партнеров. И у тех кто любит порассуждать тоже есть шанс выиграть неплохие деньги.
Давайте для начала разъясним, что такое опцион.
Опцио́н (лат. optio — выбор, желание, усмотрение) — договор, по которому покупатель опциона (потенциальный покупатель или потенциальный продавец базового актива — товара, ценной бумаги) получает право, но не обязательство, совершить покупку или продажу данного актива по заранее оговорённой цене в определённый договором момент в будущем или на протяжении определённого отрезка времени. При этом продавец опциона несёт обязательство совершить ответную продажу или покупку актива в соответствии с условиями проданного опциона. Опцион — это один из производных финансовых инструментов. Различают опционы на продажу (put option), на покупку (call option) и двусторонние (double option). Опционы и фьючерсы во многом сходные финансовые инструменты, но имеют некоторые принципиальные отличия (информация взята с ru.wikipadia.org). А больше инфы можно узнать загуглив "опционы простыми словами"
Я думаю, что большая часть тех, кто это прочитал– нихрена не понял (как и я). Но, на самом деле это не страшно, ведь мы будем зарабатывать на привлечении в систему тех, кто хоть немного в этом понимает.
Но зато нас там ожидают «вкусные» проценты: работая по реферальной программе, Вы привлекаете таких же партнеров в Binpartner.com, которые в свою очередь тоже могут привлекать других партнеров или клиентов. По этой схеме, Вы получаете 5 % от дохода Вашего реферала. Привлекая клиентов в Binomo.com (сам опцион), Вы получаете 7 % от стоимости каждого опциона Вашего трейдера. И считается, что нормальным доходом для вебмастера является 5к долларов. Неплохо, да?
Мною были прочитаны практически все существующие обзоры представленные в рамках этого конкурса, и я заметил, что все выделяют практически идентичные «плюсы» системы: большое количество промо-материалов (я таковых порядка 93-х насчитал) и множество видов вывода денег.
Я с этими позитивными моментами соглашусь – это крутые и полезные вещи, которые ИМХО должны быть на каждой уважающей себя финансовой партнерке. Но самым главным плюсом для меня является легальность всё экосистемы Binomo – всё регулируется законами РФ, а в частности имеется ЦРОФР.
Теперь непосредственно к обзору партнерки BinPartner.
Регистрация очень простая и даже примитивная в плане безопасности и это существенный недостаток. Советую добавить хотя бы подтверждение номера по коду, а лучше двухфакторную систему авторизации. Всё-таки, в системе обещают очень большой заработок.
Первое что кидается в глаза по дизайну: он в серых тонах, что позволяет сосредоточиться на работе. Также заметно, что сайт не полностью переведен на русский язык, а заявленная англоязычная версия и вовсе не отображается и переадресовывает на русскую.
Понравилось, что у партнерки есть группа Вконтакте . Но почему нет представительств в Твиттер или Фейсбук? Если что у меня есть классные иконки социальных сетей для Вас.
Я бы добавил пункт «Профиль», ведь не интуитивно понятно, что нужно нажать на адрес электронной почты, чтобы попасть на страницу редактирования аккаунта. Возможно, я бы вовсе убрал отображение email в меню.
В одном из обзоров я заметил, что минусом можно считать отсутствие раздела для новичков, но возражу – страница FAQ отвечает практически на все интересующие вопросы и меня как новичка устроила. А если еще остались проблемы с пользованием, то можно написать в скайп или на «мыло».
 |
| Дизайн главной страницы |
Вместо «Новостей» я бы сделал блог: там можно было бы публиковать какие-то обучающие материалы по работе всей экосистемы, делиться советами в разных вопросах связанных и отвечать на вопросы вебмастеров.
 |
| Дизайн письма email-рассылки (смотреть в высоком качестве) |
Во первых – выравнивание текста: по центру основной текст лучше не размещать, а сделать привычное всем левое выравнивание. А вот логотип вместе с заголовком можно и даже нужно по центру поместить.
Во вторых – это блок информации про менеджера. Я уверен, что размещение настоящего фото или стокового фото лица мужчины/женщины вызывает доверие больше, чем нарисованный человек. Так же я бы советовал выделить контакты жирным шрифтом, а может бы и заменил иконками.
Для меня решающим фактором при написании этого материала в рамках конкурса, стали отзывы про Binomo. И можете сами их посмотреть:
В конце предлагаю посмотреть смешной ролик о погоне и Марке
вторник, 24 ноября 2015 г.
В 2013 году Google впервые опубликовали свое принципы алгоритма построения результата поиска, чтобы помочь веб-мастерам понять, что поисковик ищет на веб-страницах. С того времени, многое изменилось: в частности, все больше людей пользуются смартфонам, чем раньше и больше поисковых запросов уже делается с мобильных устройствах, чем с компьютеров.
В течении почти более двух лет постоянно вносились изменения в руководящие принципы, ибо пользователи растут и развиваются, поэтому для вебмастеров была выпущена рекомбинационная книга для улучшения вашего веб-сайта (скачать в PDF).
Мими Андервуд подчеркивает, что это не окончательный вариант рекомендаций, так как изменения еще будут, но не в официальном документе: в дальнейшем компания будет сообщать о крупных изменениях у себя в блоге.
Запасаемся словарями и онлайн переводчиком, вебмастера ;)
понедельник, 23 ноября 2015 г.
Очень часто мне приходиться доказывать свою точку зрения в вопросе "Где разместить свой блог?" ибо я всем свои знакомым или клиентам предлагаю сервис Blogger. Почему я советую именно платформу от Google? Вобщем, к вашему вниманию мое сравнение Wordpress и Blogger с мнениями от ведущих блоггеров.
Где завести блог: Blogger или WordPress?
Blogger
1) Это бесплатно, а если учесть что у вас уже есть аккаунт Google, то еще и очень быстро. Большинство людей, которые только начинают заниматься блоговедением выбирают Blogspot из-за этого.2) 15 гигабайт для фотографий. Загружаемые изображения хранятся в веб-альбомах Picasa Web. И кстати, никто не запрещал создать еще один аккаунт в Гугл или же купить дополнительное место на уже существующем. Для хранения скриптов и других файлов можно использовать Dropbox или Google Drive. Кстати, я делал видеотуториал о том как пользоваться файлохранилищем Гугла.
3) SEO - это просто. Если вам скажут, что на Blogger это нереально, то знайте - ваш собеседник неправ. Неужели Вы думаете, что Корпорация Добра не позаботилась о достойном внимании к своей "дочурке"? Вот именно.
4) Подключение персонального домена. И это тоже делается очень легко в настройках блога. Главное знать как заказать домен, а об это я писал "Как зарегистрировать домен? Пошаговая инструкция". А можно и не подключать, так как у вас уже есть адрес вида site.blogspot.com.
5) AdSense уже интегрирован! Достаточно подключить аккаунт в настройках блогах и выбрать место для отображения виджета.
6) Ваши данные хранит Google. Мне так и не удалось найти информацию, что на сервера Гугл хоть раз подвергались DDOS-атакам.
Свое мнение о Blogger мне рассказал Сергей Мазураш, автор блога www.in-blog.com.
Я на Блоггер делал много сайтов для малого бизнеса - достаточно просто выводил в ТОП по нишевым запросам.
WordPress
1) Это бесплатно. Но, что вам даст сам движок? Вопрос возникает "Так-с, блог с чего начать?" Ну, можно запустить его на домашнем сервере. Стоп, но мы же хотим делиться со всеми своим материалом? Значит вам придется найти хотя бы дешевый или условно бесплатный хостинг. Но насколько это лучше, чем домен который дает Blogger?Возможно, кто сейчас вспомнит о сайте Wordpress.com и скажет, что Blogger нужно как раз с ним сравнивать. Нет, нельзя. Это настолько урезанная версия движка и настолько неудобная, что неописать словами
2) Очень много тем и плагинов. И это правда, ведь CMS Wordpress имеет самую большую популярность во всем мире, а значит и огромную поддержку как на добровольных началах, так и на коммерческой основе. Минус в том, что часто приходят уведомления что плагин устарел, а разработчик его забросил. Блог становиться уязвимым.
3) Надежность платформы. Если точнее выразить мысль, то сайты на Вордпресс уязвим. Это зависит от многих факторов: от хостинг-провайдера до установленной темы или плагина. Но опять таки, исходя из своего опыта и отзывов в интернете - этот движок хакеры любят.
4) Можно сделать любой сайт. Тоже правда. Вас никто, кроме правил хостера и законов вашей страны, не ограничивает. И это касается как тематики сайт, так и его функционала.
5) На WP - успешные сайты. В принципе это правда, но с приметкой, что и юзеров больше.
Своим мнением поделилась Наталья Митрофанова, автор сайта "Шпаргалка блоггера".
Blogger простой, бери и делай. Не сразу нужно вникать в работу с хостингами и доменами, думать о безопасности (если включена двойная аутентификация). Из минусов: Гугл иногда внедряет свои разработки и код не особо удалишь. Тем не менее работает вполне быстро, скорость загрузки "Шпаргалки" меня удовлетворяет.
Ещё из минусов: в Рунете спецов по Blogger пересчитать можно. Есть такие, кто хочет, чтобы сайт настроили за фин.вознаграждение. А за работу никто не берётся. Поэтому Blogger это то, с чем скорее всего придётся возиться самому. Если хочешь научиться разбираться с кодом - заведи блог на Blogger :)
Так что же лучше?
Нужно понять, что для тех кого кому важен контент Blogger просто чудесная находка (не я один так считаю). Вы защищены интернет-гигантом, хотя бэкап сайта не помешает делать хотя бы раз в неделю. Тот кто хочет сделать мегапортал и готов вложить деньги - добро пожаловать в мир WordPress.Я пользовался WordPress, когда еще в юности увлекался рестлингом - сайт Powerbomb.ru был как раз на нем. С рекламы я профита не получал, а не хороший хостинг приходилось деньги с обедов в школе откладывать. Уже позже я узнал о Blogger и его преимуществах, но интерес к хобби у меня пропал. Ах да, в плане движка меня всё устраивало, кроме настройки шаблона. Ну, может это из-за того что я был еще молодой-зеленый.
Поймите, я не говорю вам, что Вордпресс полное дерьмо или что-то в этом роде. Я более трех лет пользовался этим движком и мне очень нравиться open source (WordPress в том числе). Я лишь хочу донести вам мысль, что всё зависит от человека и от того какой контент и идею он предложит своим посетителям. Ведь, на обоих платформах есть полный shit (дорвеи, говносайты), а их делают люди.
Как Вы думаете, я прав насчет Blogger? Пишите в комментах ниже свое мнение и мы обязательно обсудим
А напоследок новое видео от украинской группы Антитіла - У книжках. Это очень душевный и пронзительный ролик.До скорого
пятница, 20 ноября 2015 г.
В ближайшие недели метку разместят в выдаче у всех сайтов, которые к работе на мобильных устройствах, в России, Украине, Беларуси, Казахстане и Турции.
Маркировку получат адаптированные для мобильных версии страниц (которые подстраиваются под разрешение и размер экрана и имеют один URL для всех устройств) и страницы с отдельным URL для мобильной версии (например, site.ru - m.site.ru).
Для них будет автоматически подставляться в выдачу мобильные URL. Для того, чтобы получить маркировку, страницы не должны показывать «мобильным» пользователям контент в форматах Flash или Silverlight, например видео (вместо этого лучше использовать HTML5), а их содержимое не должно выходить за рамки экрана по горизонтали. Важно, чтобы у сайта был установлен атрибут viewport для правильного определения области просмотра с мобильных телефонов.
Проверить сайт на "мобильность" можно будет в обновленном Яндекс. Вебмастер. И выглядеть это будет так:
В "Вебмастерской" подчеркивают, что наличие или отсутствие маркировки пока никак не скажется на ранжировании сайта в мобильной выдаче – это станет одним из следующих этапов, о котором в своем блоге они отдельно объявят через несколько месяцев.
Ждем-с.
четверг, 19 ноября 2015 г.
WordPress, которому недавно исполнилось 13 лет, является одним из самых широко используемых «движков»: на его базе работают 25% всех сайтов интернета. Хостинг WordPress.com (вместе с Blogger.com) является одним из самых популярных в мире.
 |
| Что лучше Blogger или Wordpress? |
- скорость;
- написан полностью на JavaScript при использовании библиотек Node.js и React (вместо PHP + MySQL);
- полностью базируется на открытых API, которые уже доступны;
- адаптивный дизайн для всех устройств и размеров экрана;
- удобный интерфейс для авторов, включающий возможность загружать иллюстрации простым - перетаскиванием в окно браузера;
- панель управления, которая позволяет управлять несколькими сайтами из одной админки;
- гибкая настройка всех параметров платформы.
Сайт WordPress.com уже перезапущен и работает на основе Calypso. Пользователи, использующие WordPress на собственном хостинге, тоже смогут перейти на Calypso, но для этого следует сначала поставить специальный плагин Jetpack.
Как утверждает сайт Ain.ua, аналитики связывают такие действия с ростом популярности конкурирующих платформ и стагнацией самого WordPress.
Сегодня я предлагаю вам оценить отличные стили для оформление цитат при помощи css и они вам несомненно понравятся.
Многие блоггеры и вебмастера игнорируют их дизайн, однако оформление цитат blockquote является очень важным в восприятии контента. Я предлагаю универсальный код, который подойдет практически для всех CMS, в том числе WordPress, а также для платформы Blogger.
Стиль оформление цитаты с почтовой совой
blockquote {
margin : 0 20px;
padding: 60px 30px 40px 20px;
background: #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHtar7vnfKHFEjqBQYp9GMeKdkft9zJ2hwJ3fFlhZqmtwpV4dCUB9myZ1aWpMSd6pr9UQDOJylbjnlf9_N4NASYptHQNPZDuqQhqn5xI1tgG1qRtqTZkH7M7uWYHuUANaZHYn4lcWmNqY/s400/owl.png)
no-repeat 350px 5px;
font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif;
color : #000;
border-left: 8px dotted #DAB547;
}
blockquote p {
margin: 0;
padding-top:10px;
} Оформление для тега blockquote с зеленными кавычками
blockquote {
font: italic 1em "comic sans ms", Tahoma, sans-serif;padding-top: 10px;
margin: 5px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_xATljhXbhG4ftucGXLORu1QOlaRGOjK_IRYr2GWmpzUBiz4IQqmrB8OqGvNxABwXH0EcCN1sPFuSQiVwP78-7hkrmVjwGRwaLsBpgAHt-V7pRGgTpOE4_Vyj15MUVK-k_HF4iB-tzOo/s400/comma2-left.gif) no-repeat top left;text-indent: 65px;}
blockquote p {
margin: 0;
padding-top:10px;
}Оформление цитаты в блоге (с темных фоном)
blockquote {
background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSgpim6QtZ9ED4JJC-lngiT3FAQtbDjYrPYG6e4xCbPkjg0decvxoIIylQrLS55Np_F5ylr8yHpSFWvB9V1NgMzV5IGr9UWyZoroV3fwT7jKVf_viCTTzAfO9B7ZCMMKvZsCD6S8RRJZs/s1600/green-black-side.gif) ;
background-position:;
background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 20px 50px;
color:#C7CACF;
font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman";
}
blockquote p {
margin: 0;
padding-top: 10px;
} Стиль оформление blockquote с оранжевыми лапками
blockquote {
font: 18px normal Tahoma, sans-serif;
padding-top: 10px;
margin: 5px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUyhTd98ZcHrbBblahQ9LOqsAyJoehIleUNX5ylP4jJWARPfMK1Tk9vWYRFnxblKTACoCXkcCMdKGJSaWTWkmxd5Lcpwxrs1YJgSL1KfCbNeNKIzbNcFcY57bVSP5zj_euP3LCOFBmCt0/s400/comma1-left.gif) no-repeat top left;
text-indent: 65px;
}
blockquote p {
margin: 0;
padding-top:10px;
}Оформление цитаты с помощью CSS (свойство border)
blockquote {
margin : 0 20px;
padding: 10px 20px 25px 20px;
background : #9FCFFF;
font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia;
color : #484848;
border: 5px dashed #fff;
}
blockquote p {
margin: 0;
padding-top:10px;
}В конце предлагаю посмотреть ролик о том, как менялись вкусы людей в течении последних 100 лет. Это будет вкусно
Подписаться на:
Сообщения (Atom)
 создал очень занимательного бота, который может превратить селфи или лю...){kind=link}
![](http://pinterest.com/pin/create/button/?url=https://www.en.ipetrenko.com/2015/11/blogger-wordpress.html&media=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyexO8jB_mWeGYQwquyrUTQrF0zSeGQtCHdjVNnFlZE1DfBpBqF0eXvKx7F8qbWCJf3S7HOXuaD6SYxeGYMe5isZ_yc8EfYgpEsT1BrFLcKP71zbnceqSGyNuQ5S9luOKx81X7pj4Dpdc/s640/chto-vibrat-wordpress-ili-blogger.jpg&description=Всем привет! Очень часто мне приходиться доказывать свою точку зрения в вопросе "Где разместить свой блог?" ибо я всем свои знаком...){kind=link}
