Объявление
Уважаемые читатели, друзья, подписчики. В связи с участившимся и, порядком надоевшим спамом в комментариях от всяких анонимах(будь они не ладны), я вынуждена включить модерацию комментариев на некоторое время. Очень надеюсь на ваше понимание.

Кнопка Print для блога

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

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

О том, как установить значок Print у себя в блоге и поговорим сегодня. Посмотрите у меня в конце сообщения слева как это выглядит.  Делается это достаточно просто. Для начала перейдём во вкладку шаблон и сделаем резервное копирование. С помощью клавиш Ctrl+F ищем строчку <div class='post-footer'>. Кто пока не знает, как это делается, прочитайте статью стили CSS в шаблоне блога.

И сразу над ней вставьте вот такой небольшой код-

<div style="float: left; padding-left: 10px;"> <a href="javascript:window.print ()" rel="nofollow"><img src="https://sites.google.com/site/moaspargalocka/ssylki/button-print.png " /></a></div>

Просмотрите шаблон и если всё устраивает, сохраняем. Заходим на страницу сообщения, где значок" распечатать" находится на месте. В этом коде можете поменять при желании left на right-право, center-центр.  10px-расстояние от края. А остальное просто копируйте и вставляйте. Выделенное синим- путь к изображению. Можете заменить  на своё. 

Я хочу предложить вам ещё несколько возможных вариантов подобных кнопок с  кодами. Копируйте и вставляйте вышеуказанным способом.

 

<div style="float: left; padding-left: 10px;">
<a href="javascript:window.print ()" rel="nofollow"><img src="https://sites.google.com/site/moaspargalocka/ssylki/print_button.gif
 " /></a></div>


<div style="float: left; padding-left: 10px;">
<a href="javascript:window.print ()" rel="nofollow"><img src="https://sites.google.com/site/moaspargalocka/ssylki/print.png " /></a></div>


<div style="float: left; padding-left: 10px;">
<a href="javascript:window.print ()" rel="nofollow"><img src=" https://sites.google.com/site/moaspargalocka/ssylki/images.jpg" /></a></div>


<div style="float: left; padding-left: 10px;">
<a href="javascript:window.print ()" rel="nofollow"><img src="https://sites.google.com/site/moaspargalocka/ssylki/button-print.png " /></a></div>

Если всё правильно установили сразу и попробуйте как это работает. Должно работать. У себя я проверила. А захотите сделать кнопку прокрутки страницы вверх, то этот пост для вас. Вот пока и всё. До новых встреч.

Удачи всем нам.


оформите подписку на новые шпаргалки

введите пожалуйста свой адрес электронной почты :

11 комментариев:

  1. Хорошая примочка. Вика а можно задать печать лишь определенной части страницы (поста)?

    ОтветитьУдалить
  2. Владимир. А попробуйте в режиме HTML при написании вставить где-нибудь в конце. Сама ещё над этим не думала.

    ОтветитьУдалить
  3. Вика привет! :) Не поверишь, но вот уже давно на эту кнопку засматриваюсь, и даже хотела у тебя спросить о ней, но ты мы опередила! :)) Инфо очень кстати!!! Честно скажу, в этих делах я чайник... :)) но вот почитала твои ссылки и вроде всё поняла и даже созрела её поставить... но у меня не получается, не могу найти этот код у себя в шаблоне. Нажала кнопку Ctrl+F, ввела код, но без результата,ни одна строчка не выделилась.Что тогда делать? Буду очень благодарна за помощь! :)

    ОтветитьУдалить
  4. Кристина, сделай резервную копию, С помощью этих же клавиш вставь код потом нажми клавишу Enter. Если не получиться просто спускайся по шаблону ниже и где-то после участка где много вот таких кодов есть эта строчка. Или тот же код, только с таким окончанием line-1'>. Отпишись пожалуйста потом.

    ОтветитьУдалить
  5. Да, резервную копию я тоже сделала. Спасибо за разъяснения, сегодня попробую ещё раз, потом отпишусь. Моя почта: krissuibra@gmail.com
    Спасибо ещё раз! :)

    ОтветитьУдалить
  6. Викуль, не знаю, или я не вижу или его нет. С помощью кнопок не находит, я уже несколько раз пересмотрела, но нет у меня этого кода. :(

    ОтветитьУдалить
  7. Кристине. Написала тебе на почту.

    ОтветитьУдалить
  8. В кнопках от "pluso" такая кнопка есть, Вот только я не проверял ее на работоспособность.

    ОтветитьУдалить
  9. Вань.Есть она. В чём проблема. Возьми попробуй. Но мне плюсо самой не очень нравится. Ну не доходят руки убрать. А так...ну правда очень симпатичная примочка , как сказал Владимир Трофымлюк.

    ОтветитьУдалить
  10. Никогда не задумывалась о необходимости такой кнопки,а ведь,наверное,это удобно.Возьму себе на вооружение

    ОтветитьУдалить
  11. Олеся, понимаете, мне однажды очень один рецептик блюда. И так не хотелось переписывать его. Бегала от компа к плите. А вот на другом блоге увидела такую кнопку распечатала и О.К. Спасибо за комментарий.

    ОтветитьУдалить

ВСЕГДА РАДА УСЛЫШАТЬ ВАШЕ МНЕНИЕ!
Ели у вас возникла необходимость опубликовать код в комментарии, то воспользуйтесь encoder HTML