BlogoDom » html

Создание собственного шаблона страницы

hawot — Fri, 11 Jun 2010 20:21:10 +0000

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

В WordPress это можно сделать легко путем создания уникального шаблона. Используя созданный шаблон в дальнейшем можно будет легко создавать специальные страницы.

Вот как делается уникальный шаблон для страниц:

1. Скопируйте файл вашей темы page.php в туже папку где он находится но с другим именем. Как правило это папка с названием темы в каталоге wp-content/themes. Именно этот файл описывает отображение страниц.

2. Можно назвать этот файл как угодно. Пусть он будет называться song.php (Это будет страница для последней написанной песни).

3. В самом верху этой страницы добавьте следующий код

/*
Template Name: Song
*/
?>

4. Измените разметку и стили текста в css. Сделать это лучше всего так:

на всякий случай сохраните резервную копии файла style.css;

откройте в редакторе файл style.css;

в этом файле найдите блок который описывает нужные нам классы (скорее всего он озаглавлен так /* posts */);

скопируйте этот блок как еще один блок в этом же файле и переименуйте его (чтобы не запутаться);

измените названия классов в новом блоке (например допишите к ним слово song) и измените свойства стилей текста;

в новом файле song.php измените названия классов аналогично как в файле style.css;

там же можно убрать, например, блок комментирования.

5. А теперь самое интересное. То, ради чего мы все это затеяли. Идем в админку блога и при создании новой страницы, выбираем только что созданный нами шаблон (панель «Атрибуты», справа внизу).

6. Остается наполнить страницу контентом и опубликовать. Она будет иметь оформление и разметку отличную от остальных страниц. Такую которую мы только что описали в файле style.css.

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

Только тщательно и профессионально проведенная оптимизация сайта позволит вам занять нужное место в поисковой выдаче.

Post from: BlogoDom

Создание собственного шаблона страницы

Вернемся к основам — Краткая памятка по основным html-тегам

hawot — Wed, 16 Sep 2009 17:08:06 +0000

Краткая памятка по основным html-тегам.

В первую очередь для себя. Но может и кому еще пригодится.

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

Основные html-теги с описанием их назначения:

— Корневой тэг, указывает браузеру, что это HTML документ

— «Голова» HTML документа, в которую прописывается название, таблицы стилей (CSS), которые подключены к этой странице, различные мета-тэги (описание, ключевые слова, переадресация, кодировка и т.д.)

— Название HTML страницы

— Тело документа, в которое помещается весь основной контент страницы.

— Параграф, который позволяет разбивать текст на блоки.

— Тэг для вставки изображений на HTML страницу

— Создание ссылок на другие документы и файлы.

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

— Тэг переноса строки.

— Логический тэг, используется для выделения отдельных слов в предложении с помощью CSS и других подобных вещей.

(замена устаревшему тэгу ) — Жирный текст.

(замена устаревшему тэгу ) — Курсив.

— Таблица.

- Строка таблицы

— Ячейка строки

— Элемент списка.

()

В совокупности со статьей HTML Физическое форматирование получается прямо справочник, а не памятка.

Если все выше написанное для вас «китайская грамота», заказывайте создание сайтов людям, которых не пугает html-код.

Post from: BlogoDom

Вернемся к основам — Краткая памятка по основным html-тегам

У Google снова новый html-тег.

hawot — Thu, 03 Sep 2009 10:48:22 +0000

Не знаю зачем, наверное кому-то нужно что бы его сайт не переводился при помощи Google Translate и что бы в результатах выдачи не было ссылки “перевести страницу”. Вот для таких вебмастеров Google придумал очередной новый html-тег — “NoTranslate”. Google может себе позволить вводить новые теги. Даже если другие поисковики его не примут, доля Google в поиске, позволяет ему делать теги даже только для себя.

Новый тег отменяет появление ссылки “перевести страницу” рядом с вашим сайтом в результатах поисковой выдачи Google.

Полностью тег выглядит следующим образом:

Просто внесите этот тег в html код страницы.

Кроме того вы можете запретить перевод части страницы. Для этого к фрагменту который вы хотите закрыть от переводчика, добавьте «class=notranslate».

_
Вот такая вот социальная сеть для блоггеров. Здесь интервью, реклама и маркетинг, сервисы и инструменты, разработка, лайфхак, софт и другие новости.

Post from: BlogoDom

У Google снова новый html-тег.

Новый html тэг — канонические url ссылки

hawot — Tue, 17 Feb 2009 19:23:06 +0000

Не часто такое бывает, но вот случилось. Google, Yahoo и Microsoft объявили о поддержке нового html тега. Тег дает понять поисковикам какой настоящий URL у текущей страницы. Выглядит тег следующим образом:

И если Вы показываете на вашем блоге ссылки на свои статьи в разных виджетах (например: последние комментарии), они могут иметь в своем коде тег rel=»canonical». И этот тег покажет поисковым системам каноническую URL ссылку на статью, т.е. ссылку где статья первоначально была опубликована. Это защит Ваш блог от дублированного контента.

Чтобы лучше понять, можно посмотреть на код этого блога. Посмотрим на код предыдущей статьи. Ее url: http://blogodom.ru/twitter-timer/

В тоже время страница на комментарии к этой статье имеет url:
http://blogodom.ru/twitter-timer/#comments

Мы имеем одинаковое содержание с разными url. То есть на нашем блоге мы имеем дублированный контент. Раньше, в подобных случаях, приходилось бороться с дублированным контентом с помощью различных плагинов или файла robots. Теперь же достаточно добавить в код тег с канонической ссылкой этой страницы. В данном случае, он будет выглядеть так:

В коде страницы комментариев к статье (http://blogodom.ru/twitter-timer/#comments) будет стоять такой же код, указывающий на канонический url статьи.

Теперь посковик поймет где находится основная страница, а где полученная от нее искусственно.
Тег canonical будет очень полезен не только на блогах но и, к примеру, на сайтах интернет магазинов.

НО. Тег canonical носит рекомендательный характер. Поисковик оставляет за собой право принимать решение. Но предполагается, что в 99% поисковые системы будут руководствоваться этим тегом.

О возможностях и последствиях использования канонических ссылок можно будет судить через некоторое время. Но плагин для wordpress, устанавливающий канонические ссылки в код вашего блога уже существует: Canonical URL plugin. Установка Canonical URL плагина стандартная и не требует настроек.
_
блог об интеренте: заработок, общение, знакомства http://wm-ecomers.ru

Post from: BlogoDom

Новый html тэг — канонические url ссылки

HTML Физическое форматирование

blogovod — Wed, 31 Oct 2007 15:35:00 +0000

Физическое форматирование

Физическое форматирование документа (визуальное)
позволяет создавать различные виды выделения части текста по
смысловому признаку. Например, можно подчеркнуть часть текста
с помощью тега или же сделать
наклонное начертание с помощью тега .
По возможности стоит отдавать предпочтение тегам

логического форматирования документа.

Перейдем к описанию тегов физического форматирования документа.

Часто для удобства документ разделяют заголовками разделов с
помощью тегов <Hn> и </Hn>,
где n может принимать значение от 1 до 6:

Заголовок 1

Заголовок 2

Заголовок 3

Заголовок 4

Заголовок 5

Заголовок 6

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

Выравнивание по левому краю

Выравнивание по центру

Выравнивание по правому краю

Выравнивание по ширине страницы.
Для параграфов, содержащих большое количество текста, этот вариант выравнивания
выглядит гораздо лучше, не правда ли?

Текст после 
переходит на новую строчку.

Начерание текста определяется следующими тэгами:

Жирный

Курсив/наклонный

Подчеркнутый

<STRIKE> Перечеркнутый</STRIKE>

^{Верхний индекс}

_{Нижний индекс}

Шрифт для фрагмента текста можно задать с помощью тега
 (закрывающий тег
 обязателен).
Свойство SIZE определяет размер текста,
значения размера от 1 (мелкий) до 6 (крупный), по умолчанию

SIZE=3.
Свойство FACE задает имя шрифта.
Можно задавать несколько имен шрифтов через запятую.
Если у пользователя не окажется первого шрифта, то браузер будет подставлять второй
и т.д. Свойство COLOR задает цвет текста.
Можно использовать как имена цветов (red, blue, green) так и номер в виде
#RRGGBB, где RR — концентрация красного, GG — зеленого, BB — синего.
Выделение текста цветовым фоном достигается использованием свойства
style=»backgroud-color: цвет«.
Продемонстрируем применение тега на примерах:

Размер 1

Размер 2

Размер 3

Размер 4

Размер 5

Размер 6

Times New Roman

Arial

System

Verdana

Courier

<
class=»tag»>FONT FACE=»Comic Sans MS«>Comic Sans MS

Красный

Зеленый

Синий

Текст на розовом фоне Текст на обычном фоне.

Мой блог находят по следующим фразам

Post from: BlogoDom

HTML Физическое форматирование