Последнее обновление: 9 Июнь 2015 в 4:12
28 Февраль 2012

Как закрепить картинку(фото) на заднем фоне блога wordpress, чтобы она не прокручивалась вместе с контентом.

Сегодняшний пост будет полезен опять же владельцам нерезиновых шаблонов wordpress. Очень часто вебмастера сталкиваются с проблемой оформления своего блога, они хотят сделать его красивым и привлекательным, чтобы посетителям было приятно находиться на таком блоге. На что только не идут вебмастера, пытаясь изменить внешний вид блога так, как они хотят. Я уже писал о том, как поменять задний фон блога. Ну а сегодня речь пойдет о том, как сделать так, чтобы фон блога не проматывался мышкой, а был стационарно закреплен. На большинстве блогов стоит какой - нибудь фон, который проматывается мышкой вместе с контентом. Как вы понимаете, это не есть гуд. А есть вариант сделать так, чтобы на вашем блоге, к примеру, садово-огородной тематики, на заднем плане был какой - нибудь очень красивый рисунок с урожаем, цветущие цветы, в общем, чтобы было красиво. И сделать это очень просто, нужно всего лишь произвести последовательность определенных действий. Ну что, начнем?

Выбор картинки для заднего фона блога и закачка ее на сервер

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

Теперь по размерам. Так как ваши посетители имеют разные мониторы, то и картинка на разных мониторах будет выглядеть по разному, на широкоформатном мониторе и на квадратном(старом) по-разному. Поэтому лучше берите картинку для заднего фона блога с запасом, как сделал я. Примерно 1500 на 1300 пикселей, размером не больше 1 мб, хотя интернет сейчас у всех скоростной, однако сколько времени будет загружать ваш задний фон посетитель с медленным интернетом, одному богу известно. Оптимальный размер картинки для заднего фона блога - 500 мб.

Итак, картинка выбрана, теперь загружаете ее к себе на сервер. Сделать это вы можете как через фтп-соединение( используя любой фтп-клиент, тотал коммандер, файлзилла), либо непосредственно прямо из админки вордпресс вашего блога. Чтобы залить картинку из админки wordpress на сервер, идете в раздел "медиафайлы", далее жмете"добавить новый", выбираете картинку с вашего компа и жмете "загрузить".

Итак, картинка для заднего фона блога загружена, теперь нам нужно узнать ее адрес(url). Для этого в разделе "медиафайлы" - "библиотека файлов" находим вашу загруженную картинку и жмем "изменить". Менять ничего не надо, после нажатия откроется окно, внизу которого вы сможете увидеть ссылку на ваш файл. Копируем его.

Редактируем файл Style.css

Итак, шаг номер 2 - редактирование файла style.css, который отвечает за внешний вид вашего блога. Шрифты, размер букв, цвет, фон сайта и многое другое - все это вы можете поменять, изменив этот файл. Прежде всего, перед всеми вашими движениями сохраните этот файл к себе на компьютер, на случай, если что - то у вас не получится. редактировать файл мы будем прямо из админки вордпресса, хотя можете скачать его и редактировать в программе notepad. Если редактируете в админке, то путь такой "внешний вид"-"редактор" - проматываете в самый низ и видите файл style.css.

Открываем файл style.css и в самом начале ищем вот такие буквы, а именно тег body.

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

У вас может быть написано другое, но суть одна - находим открывающий тег body, далее находим параметр background, если у вас много чего написано, то просто сделайте так, как на рисунке. Далее прописываем ссылку на ваш загруженный рисунок для заднего фона блога. Ну и указываем параметр fixed, который отвечает за то, чтобы закрепить рисунок(фотографию) на заднем фоне вашего wordpress блога. По сути, вы должны сделать 4 шага:

1. Залить рисунок на сервер.
2. скопировать ссылку на него.
3. Вставить ссылку на сайт в файле style.css
4. Указать, чтобы она закрепилась на заднем фоне.

В итоге вы получаете красивый рисунок на заднем фоне вашего блога, который НЕ ПРОКРУЧИВАЕТСЯ. Он будет стационарным, а прокручиваться мышкой будет контент вашего блога. То есть посетителю вашего блога будет очень удобно, на заднем фоне сайта будет красивая картинка, а мышкой он сможет свободно прокручивать ваши статьи( разумеется, если они более менее длинные).




К записи "Как закрепить картинку(фото) на заднем фоне блога wordpress, чтобы она не прокручивалась вместе с контентом." оставлено 4 коммент.

Полезный пост. Лично меня фон, который съезжает, чаще всего раздражает ,т.к. выглядит не совсем красиво. Вообще тема бэкграунда довольно щекотливая. Я никогда не пользовался фоновыми рисунками, т.к. не мог подобрать достойный, а рисовать в фш сам я абсолютно не умею.
Белый фон — черный текст, минимализм, елки-палки) Хотя больше нравится белый текст на черном фоне, лично у меня так глаза гораздо меньше устают при длительном чтении, однако черный фон почему-то не рекомендуют всякие гуру сео :)

Просто правил свой второй блог, так что подумал, а вдруг кому-нибудь пригодится )) Теперь задний фон блога мне несказанно радует глаза ))

Огромное спасибо за статью! Я абсолютный чайник, делаю свой первый сайт. Благодаря Вам удалось сменить фон с первого раза! Я в шоке! )))

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


Оставить комментарий

Подпишись на RSS

подписка на обновления

Введите ваш e-mail адрес:

Использую в работе

ГоГетЛинкс
Для сайтов с тиц 10 и выше, высокие цены на постовые и обзоры. Заработок на продаже ссылок. Для оптимизаторов - отличные вечные ссылки.
ГетГудЛинкс
Зарабатываем на страницах с PR, очень высокие цены на ссылки с пиаристых страниц.
Miralinks
Лучшая биржа для продвижения сайтов статьями. Все проекты "качаю" мощными ссылками с этой биржи. Траф с Гугла просто прет благодаря таким ссылкам.

Все для создания сайтов

Домены RU по 99 рублей
Удобная регистрация доменов RU и РФ по 99 рублей.
Хостинг для сайтов
Отличный, недорогой хостинг для сайтов всего за 100 рублей в месяц.

Работа с контентом

Биржа контента №1 - Etxt
Биржа контента №2 - Контентмонстр
Турботекст - микрозадачи - комменты, лайки, твиты, соцсигналы и прочее.

Социальные сигналы

Просперо - покупаем твиты и другие социальные сигналы.
Qcomment - купить комментарии для сайта(продвижение по НЧ), также можете заработать на комментировании.

Мой хостинг провайдер

Комментарии

Присоединяйтесь к обсуждению
  • ly4ike: Отличная статья, спасибо, то, что нужно! Посоветовала знакомым. Все просто и конкретно.
  • ly4ike: Ждем-с новых статей!
  • ly4ike: Главное, не сдаваться! Быть упорным и настойчивым в достижении успеха! Только впереД, хвост пистолетом!
  • Елена: Заметила что когда был размещён 1 блок рекламы, цена за клик была в разы выше, но когда разместила второй, то...
  • seoonly.ru: Чот в рунете совсем тухляк если что)
Как создать сайт с нуля на wordpress, опыты в seo, заработок в интернете.
Как заработать деньги в интернете? Просто не нужно заниматься всякой байдой(буксы, клики и т.п.). Делайте блоги, растите посещаемость и ставьте контекстную рекламу. ВСЁ, ёпта, секрет прост. А ответы на свои вопросы вы сможете найти здесь, на этом блоге. Не стесняйтесь спрашивать - я всегда на связи.

Как я начинал

Рубрики

Поиск информации по категориям

Счетчик

Статистика сайта
Анализ сайта