С появлением сложных и удобной системы управления контентом, как WordPress, текстовое содержание становится все более легче управлять.Архитектура этих систем стремится поставлять хорошо сформированным кодом основу, а это значит, что если вы хороший писатель, то ваше содержание будет столь же удивительным, как структура и качество кода, который выполняется it.
Тем не менее, средства массовой информации обращение, по своей природе, не самое лучшее.Во многих случаях изображения используются только, чтобы сделать сайт хорошо выглядеть, а не для пополнения содержания.Маленькая ухода обычно принимается, чтобы сделать эти элементы так полезны, как их текстовые аналоги.Они часто прикрепил на качестве запоздалой мысли, владелец думает “. Если все мои сообщения имеют изображение, конечно же, я должна найти что-то быстро для этого следующий, а”
Потому что содержания изображения не могут быть разобраны на поиск engines, убедившись, что они богаты мета-информацию, прежде чем опубликовать их имеет важное значение.Вот несколько способов, чтобы обогатить свой блог с помощью здравого смысла, передового опыта и силы WordPress.
Понимание и использование Images
Чтобы получить максимальную отдачу от Вашего графического контента, вы должны быть знакомы с тем, как они работают в HTML.Чтобы поместить изображение на страницу, вы должны добавить тег изображения, с соответствующими атрибутами, например, так:
<img title="A duck" src="http://myimages.com/theimage.jpg" alt="A mallard duck landing in the water" >
Как видите, тег имеет три атрибута, которые содержат информацию об изображении:
-
srcявляется источником URL файла изображения; -
alt, или альтернативной, текст отображается, когда изображение не может загрузить (то ли из-за загрузки ошибки, текстовый браузер, и т.д.); -
titleэто название атрибута, где вы можете добавить краткое описание изображения, которое будет появляться сразу после того, как зависший над изображение для second.
src и alt атрибуты как обязательные, HTML является недействительным без них.Однако, HTML не является строгим языком.Ваше сообщение будет по-прежнему оказывать просто замечательно, если оставить в стороне alt текста, который является одним из negative аспектом свободной языках: оно не заставит лучшим practices.
Зачем использовать Alt и Title атрибуты
Самый полезный аспект alt и title является то, что они позволяют вам добавить текстовую информацию к элементу на своем сайте, которые могли бы быть невидимыми для поисковых систем.Если вы продаете зонтики, Google не будет видеть, что одно конкретное изображение на вашу страницу из самых крутых зонтиком она когда-либо видела.Вы должны будете добавить, что информация yourself.
Кроме того, alt атрибут может быть огромной помощью для инвалидов, потому чтоВот как они знают, что в изображении.Так, использовать title атрибут, чтобы написать что-то быстро об изображении, и использовать alt атрибут для описания it.Вставлять с нашим зонтиком, например, неправильный способ сделать это будет:
<img title="Awesome umbrella" src="awesomeumbrella.jpg" alt="The most awesome umbrella ever" >
И правильно было бы:
<img title="Awesome umbrella" src="awesomeubrella.jpg" alt="A matte black cane umbrella with a spruce handle and a chrome tip" >
Помните, что alt атрибут носит описательный характер не только для инвалидов по зрению, но и для Google, а также.Ваш сайт может даже оценить лучше, если это имидж-heavy.
Хотя не так критично, то, вероятно, стоит оптимизация имя файла, а также.Название o290rjf.jpg не будет мешать показывать изображения, но супер-гладкий umbrella.jpg является выделяемого фрагмента текста, и есть шанс, что некоторые поисковые системы будут принимать ее восчет.Кроме того, если кто-то загружает изображения с вашего сайта, они смогут найти его легче в их “Загрузки”.И удовлетворенность пользователей приводит к более visits.
Добавление изображений правильно с WordPress
WordPress позволяет прикреплять к сообщениям средств массовой информации очень легко через “Добавить медиа” модальное окно, которое можно открыть, нажав на одну из иконок на панели редактирования в должности.Вы можете выбрать несколько изображений и загружать их на почту с помощью мыши.Потому что это так легко, добавляя атрибуты мета часто упускается из виду и рассматривается как hassle.
При загрузке изображений, убедитесь, чтобы заполнить форму, которая отображается.Добавить title и alt атрибут, как минимум, но и рассмотреть вопрос о заполнении в заголовок и описание полей.Если вы хотите короткий, удобный формат заголовка появляются под изображением (которое является хорошей идеей), типа один дюйм мы рассмотрим позже в освоение поле описания, так что написание пункта или так об изображении может быть хорошейidea.
После этого, все, что вам нужно сделать, это вставить изображение, и правильные теги HTML будут шлепнулся в на WordPress автоматически.Принимая дополнительные минуты, у вас будет добавлен значительный фрагмент текста к изображению, что делает его SEO-дружественным и, в свою очередь сделать свой сайт, что гораздо более информативным.Если все это у вас есть время, то вы сделали самый важный шаг.Но давайте посмотрим на некоторые более продвинутые обработке изображений techniques.
Управление изображения Sizes
Если вы выводить изображение с размером 450 × 300 пикселов, а затем с файл-образ примерно такого же размера является хорошей идеей.Если исходный файл является 2250 × 1500 пикселей, то изображение будет отображаться только штрафом, но вместо загрузки 50 KB изображение, вы бы загрузку 500 KB изображения, в то время как достижения той же effect.
WordPress является супер-умные, однако, заботиться об этом для вас штамповать различные размеры для каждого изображения вы загружаете.См. размеров она создает, перейдя в СМИ настроек в задней части.Вы можете изменить это когда у вас есть окончательный макет, который я бы advise.
Для изображения ориентированный сайт, вы можете добавить еще пару размеров, чтобы убедиться, что вы никогда не использовать картинку, которая большечем это необходимо.Поставив следующий код в __ вашей темы 0 | functions.php файл, необходимо создать два дополнительных размеров:
add_image_size( 'large_thumb', 75, 75, true ); add_image_size( 'wider_image', 200, 150 );
Первая строка определяет изображение, обрезать ровно 75 × 75 пикселей, а вторая строка определяет изображение, максимальный размер составляет 200 × 150, при сохранении пропорций.Обратите внимание, что имя, данное в первом аргументе функции, потому что вы будете обращаться к нему при получении изображения, которые вы можете сделать, например, так:
wp_get_attachment_image_src( 325, 'wider_image');
Первый аргумент является идентификатором вложения, которые мы хотим показать.Вторым аргументом является размер image.
Восстановление Ваша Thumbnails
Если вы были блогами то время как сейчас, у вас есть тонна изображений.Добавление размер изображения теперь будет not создать новые эскизы из ваших существующих изображений.Если указать размер изображения, например, наши wider_image Format-WordPress будет получать разрешение, близкое к ней, но она не будет создавать миниатюру специально для этого size.
Использование плагинов, однако, вы можете вернуться назад и восстановить эскизы, чтобы убедиться, что все изображения оптимизированы, таким образом, минимизация сервер load.Я могу лично поручиться за AJAX Thumbnail Rebuild, которая проходит через все ваши изображения и восстанавливает выбранный размеров для you.
Использование Рекомендуемые Images
Признакам изображения может захватывать сообщения от должности.Избранные изображения имеют множество применений. Для добавления вспышки в журнале стиль макета, подчеркнув, сделанное в статье, или заменив название статьи (на боковой панели, например)
Избранные фотографии были построены в WordPress, начиная с версии 2.9, так что вам не нужно никаких специальных плагинов.Если вы используете новые умолчанию WordPress theme, TwentyTen, или передовые TwentyEleven (которая сейчас только в версии для разработчиков), то Избранные изображения уже включен.В противном случае, вам придется включить их вручную.Чтобы включить их, просто откройте __ 0 вашей темы | functions.php файл, вставить в код, и вуаля
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 115, 115 )
Первая строка кода говорит WordPress для включения Избранные изображения, а второй задает размер по умолчанию признакам миниатюр.set_post_thumbnail_size() бит работает как add_image_size() функции мы смотрели на выше.Вы можете задать ширину, высоту и, возможно, третьего логического параметра (true или false), чтобы указать, должна ли она быть точным crop.
Когда это будет сделано, перейдите в задней части и редактировать пост.Вы должны увидеть изображение признакам виджет в правой боковой панели, щелкните на нем, чтобы добавить изображение.Или перейдите к разделу СМИ сообщение, просмотреть детали изображения, и нажмите кнопку “Использовать в качестве признакам изображение” link.
Единственное, что осталось сделать, это эти Избранные изображения появляются!Вам нужно будет изменить код для цикла в файлах вашей темы, которые обычно находятся в Index.php или в некоторых случаях loop.php.Ищите что-то вроде этого:
<?php while ( have_posts() ) : the_post(); ?> The code to display a post is inside here, it can be quite long <?php endwhile; ?>
Где бы вы хотели, чтобы показать изображения, добавлять следующий в цикле:
<?php the_post_thumbnail(); ?>
В некоторых случаях, вы можете захотеть, чтобы показать, показанных на изображении размером отличается от значения по умолчанию.Если да, то вы можете передать нужный размер в качестве аргумента, например, так:
<?php the_post_thumbnail("wider_image"); ?>
Вы можете назвать размер, который вы создали ранее, используя add_image_size(), как я сделал выше, или вы можете использовать массив для указания размера на лету. array(225, 166)
Создание Galleries
Самый простой способ показать несколько фотографий в должности, чтобы загружать изображения на должность и затем использовать галерею короткий, чтобы отобразить их all.
Просто откройте “Загрузить / вставить» СМИ экран, нажмите на кнопку “Галереи” и прокрутите вниз до настройки галереи.Убедитесь, что ссылки указывают на вложение страниц (подробнее об этом позже), а затем вставить в галерею.Теперь, эскизы всех фотографий вы загрузили на этот пост будет отображаться, каждый связан с его привязанность page.
Включение и исключение Images
Вы легко можете включить изображения из других сообщений или исключить определенные образы из нынешней должности, изменив галерея короткий номер.Если вы переключите редактор зрения HTML, вы должны увидеть [ gallery ] где галерее будут показаны.Вы можете добавить варианты, используя следующий формат:. [ gallery option_1="value" o ...
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров