• Облако меток

Архив категории: Уроки

WordPress плагин для создания опросов

Январь 22, 2012   Александр Маврин   6 комментариев

Рад приветствовать всех, кто читает сейчас эти строки. И сегодняшний пост посвящен тем, кто изучает WordPress. Разговор пойдет о плагине WP-Polls, с помощью которого на страницах блога можно проводить опросы. Это придает блогу дополнительную функциональность и некую интерактивность. Более того, с помощью опросов можно выяснить, какую информацию хотели бы получать читатели вашего блога, что им более интересно, а что менее. Проведя опрос и сделав анализ можно существенно повысить качество предлагаемой информации.

Установка плагина ничем не отличается от стандартной. После его активации в административной части WordPress на панели справа появится пункт Polls. для добавления нового опроса нужно выбрать пункт: Аdd Poll (добавить опрос). После сохранения каждому новому опросу присваивается свой id, который потом нужно будет вставить в то место на странице, где хотите, чтобы этот опрос был.

В визуальном редакторе публикации статей тоже появляется специальный пункт, который поможет вам вставить опрос на страницу. Или же это можно сделать вручную, не пользуясь этим пунктом. Вот так:

[poll id="1"] - В кавычках указываете id опроса.

А чтобы было более понятно, посмотрите специальное видео о том, как создавать опросы. и все сразу станет понятно. А после просмотра можете посмотреть как выглядит опрос на этой странице, проголосовать и скачать сам плагин.


Была ли эта информация вам полезна?

Loading ... Loading ...

Популярность: 17% [?]

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

Красивое оформление цитат на странице при помощи CSS

Январь 03, 2012   Александр Маврин   2 комментария

Всем привет и добро пожаловать на SerBlog.ru. Не так часто, но иногда приходится пользоваться тегами (blockquote) цитат на странице. Обычно это происходит в комментариях, когда нужно процитировать ранее опубликованный комментарий, чтобы было понятно кому вы ответили. Или же просто выделить в статье какую-то часть текста, чтобы сделать акцент и привлечь внимание читателя к чему-то очень важному, по вашему мнению. Обычно в таблицах стилей сайтов уже прописано какое-то оформление для этого тега, но в большинстве случаев это оформление ограничивается лишь наклоном текста. Поэтому мы попробуем изменить эту ситуацию и настроить оформление так, как нам нужно. Выглядеть эту будет вот так:

Знать много и не выставлять себя знающим есть нравственная красота. Знать мало и выставлять себя знающим есть болезнь. Только понимая эту болезнь, мы можем избавиться от нее.
Лао Цзы.

Для того, чтобы изменить оформление, нужно открыть таблицу стилей, обычно это style.css и найти там blockquote. Добавить или вставить вместо тех, которые есть примерно такие строчки:

1
2
3
4
5
6

	font-size:14px;
	color:#444ddf;
	background-color:#ffc;
	border-style:dashed;
	border-width:2px;
	border-color:red;

Первые 2 строчки это размер и цвет текста. Третья — это фон. Четвертая-рамка (dashed-пунктирная линия). Дальше-размер этой рамки и ее цвет.

Популярность: 17% [?]

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

Страница, динамично меняющая цвет фона. Видео

Декабрь 11, 2011   Александр Маврин   Комментариев нет

Всем привет. Сегодня поговорим об интересном эффекте для интернет страницы при помощи JavaScript. Страница плавно переливается всеми цветами радуги. Можно использовать в качестве поздравительной страницы и добавить в нее картинок. Или же применить это эффект на своем сайте, например в честь какого-нибудь праздника. Или же просто поэкспериментировать, чтобы понять, что и как работает. Понять принцип, так сказать. Для того, чтобы добиться такого эффекта нужно подключить к странице всего один системный JavaScript файл, в котором  совсем немного кода. Посмотрите демо странички, которую я сделал. Чтобы совсем не было пусто, я добавил в нее пару картинок.

Посмотреть демо

В видео я показываю как встроить данный эффект в  существующий сайт или блог.


Популярность: 14% [?]

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

Красивая форма подписки для Smartresponder

Декабрь 05, 2011   Александр Маврин   10 комментариев

Всем привет. Сегодня речь пойдет о формах подписки для Smartresponder и о том, как их делать. К сожалению на сайте сервиса Smartresponder формы подписки, которые предлагаются, имеют не очень красивый вид и порой портят весь дизайн на сайте. Но, как всегда, есть выход, который многим может прийтись по вкусу и цвету. Вот один из примеров форм:

Форма подписки

Если Вы владеете каким-нибудь графическим редактором, например фотошопом, то экспериментировать над дизайном формы можно сколько угодно. Если же нет таких навыков, то используйте готовые формы, скачав их в конце этой записи. В архиве представлено 4 варианта форм. Теперь давайте посмотрим, что нужно сделать, чтобы форма нормально функционировала. Во-первых нужно закачать картинки на сервер. Кнопка и блок с Формой отдельно в какую-нибудь папку. В коде формы, который прилагается, нужно прописать пути для картинок. Затем найти вот эти строчки:

<input name="tid" value="0000" type="hidden"/>
<input name="uid" value="00000" type="hidden"/>
<input name="did[]" value="00000" type="hidden"/>

И вписать вместо нолей — данные своей рассылки. Их можно посмотреть в коде стандартной формы на сайте Smartresponder.ru.  Форму можно вставлять как в сайдбар (боковую колонку), так и  в сами статьи.

Внимание!

На некоторых сайтах форма может отображаться некорректно. Это связано с тем, что сайты в основном имеют собственные таблицы стилей, поэтому могут в некоторых случаях конфликтовать с кодом формы. В таких случаях рекомендую использовать отдельную страницу подписки, как это сделано у меня. Кстати, сегодня для подписчиков выходит новая книга, спешите получить свой экземпляр здесь.

Пишите в комментариях у кого, что получилось.

Популярность: 40% [?]

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

Рисуем липкие стикеры в фотошопе

Август 29, 2011   Александр Маврин   Комментариев нет

Привет всем, кто читает SerBlog.ru. Сегодня немного пофотошопим и узнаем, как нарисовать красивые стикеры в фотошопе. Стикеры могут понадобится для оформления своих сайтов.

Итак, в качестве примера создадим в фотошопе документ, можно стандартный web (640×480), разрешение 72рх на дюйм. Зальем фон цветом #3e3d3d. Далее создадим новый слой, выбираем инструмент Кисть белого цвета в форме круга. Размер кисти 50рх, жесткость 0. Посередине документа на новом слое нажимаем кистью один раз. Делаем прозрачность круга 60%. Применяет размытие по Гауссу 70рх. К фону добавляем шум. Вкладка: Фильтр — Шум — Добавить шум и выставляем значение 2% по Гауссу, монохромный. Можно еще применить наложение цвета, какой Вам больше нравится и сделать его прозрачность примерно 10%.Фон для стикеров

Итак, фон у нас готов. Теперь берем инструмент Прямоугольник и рисуем прямоугольную фигуру белого цвета. Копируем (Ctrl+J) фигуру и перемещаем копию ниже оригинала (перетащить мышкой слой копии). к копии слоя применяем наложение черного цвета. Затем выбираем инструмент Трансформирование или же просто нажимаем Ctrl+T. Зажимаем Ctrl и тянем правый нижний угол копии фигуры вниз на несколько пикселей и немного влево по диагонали. Выставляем прозрачность слоя 70% и применяем размытие по Гауссу 3рх. В принципе один стикер мы уже изготовили. Должно получиться примерно вот так:Липкие стикерыТеперь попробуем добавить немного эффектов для самого стикера. Для этого можно применить наложение узора и внутреннюю тень и выставить прозрачность на глаз. Вот, что должно примерно получится.Стикеры для сайта

Популярность: 46% [?]

Читать полностью
Страница 1 из 712345...Последняя