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

Заменить предыдущие и следующие страницы на заголовок постов.

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

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

навигация в блоге


Наглядный пример на тестовом блоге внизу под комментариями..

Шаг 1. Подключаем библиотеку jquery. Сразу проверьте её наличие.Читаем здесь что это за "зверь" такой. Если у вас скрипт уже установлен, то этот шаг пропускаем. Если таковой не имеется, идём во вкладку шаблон - изменить HTML. Находим закрывающийся тег </head>.

Над ним устанавливаем следующий скрипт.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Сохранить шаблон.

Шаг 2.  В админке блога заходим во вкладку дизайн - добавить гаджет.  Выбираем из предложенных HTML/JavaScript. В него вставляем этот код.
<style type="text/css"> .home-link{display:none} #blog-pager-newer-link {font-size:14px;width:300px;float:left; text-align:left;font-family:Arial, sans-serif;} #blog-pager-older-link {font-size:14px;width:300px;float:right; text-align:right;font-family:Arial, sans-serif;} </style> <script type="text/javascript"> $(document).ready(function(){ var olderLink = $("a.blog-pager-older-link").attr("href"); $("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() { var olderLinkTitle = $("a.blog-pager-older-link").text(); $("a.blog-pager-older-link").text(olderLinkTitle + "\u2192");//rgt }); var newerLink = $("a.blog-pager-newer-link").attr("href"); $("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() { var newerLinkTitle = $("a.blog-pager-newer-link:first").text(); $("a.blog-pager-newer-link").text("\u2190" + newerLinkTitle); }); }); </script>
Здесь font-size:14px - размер шрифта, 300px;float - длина текста, Arial, sans-serif;- свойства шрифта. Всё это можно поменять на ваше усмотрение.

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

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

Введите Ваш email


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

  1. Хорошая фишка, видела такое на некоторых блогах. И делается просто..Только надо следить, чтобы названия постов были не слишком длинными.
    Вика, разведка донесла, что у тебя сегодня День рождения)
    Поздравлю! И желаю тебе всего самого светлого. Будь здоровой и счастливой много-много лет!

    ОтветитьУдалить
    Ответы
    1. И я присоединяюсь! Весеннего настроения, жизненных сил, благополучия и пусть дети и муж помогают, радуют и любят!

      Удалить
    2. Девчонки, спасибо вам большое за то что вы есть, за ваши поздравления и пожелания. Всех люблю.

      Удалить
  2. Здравствуйте.
    А не подскажите, в дизайнере блоггер теперь у всех "планшетный формат отображения" ? Высота колонок разрослась просто невообразимо!
    Мне просто нереал стало работать (((( У всех так?
    http://s014.radikal.ru/i329/1603/f8/b4616d0c3d8b.png
    Я просто в печали... ((((

    ОтветитьУдалить
    Ответы
    1. Не знаю, что у вас такое. У меня всё ОК. И даже ваши блоги нормально отображаются. попробуйте сделать резервную копию блога и установить другой шаблон.

      Удалить
    2. И даже ваши блоги нормально отображаются - думаю вы не поняли проблему, вы не могли посмотреть "в моих блогах", т.к. банально не имеете доступа к его настройкам. Речь именно про настройки блога - раздел "дизайн". Там изменилось всё и стало жутко неудобно.

      Удалить
    3. И шаблон я разумеется не буду менять, т.к. я его сам дорабатывал, да и не поможет это. В общем печаль, мне уже в сообществе гугл плюс ответили что у всех так теперь... жаль... очень фиговое обновление.
      https://plus.google.com/b/112209780765745764654/+OlgaProtasova/posts/VAUKrkwPBp1?cfem=1

      Удалить
    4. Я Вас прекрасно поняла и имела ввиду именное раздел дизайн. Такое уже давно и неудобств я особо не ощущаю.

      Удалить
  3. Кажется, я не очень опоздала... и поэтому, очень рада, Вика, поздравить Вас с днём рождения!!! Пусть будут всякие радости и "приятности" http://s7.hostingkartinok.com/uploads/images/2014/07/72ac52b5cb829accbeb5cb5d3fead387.jpg

    ОтветитьУдалить
    Ответы
    1. Любовь, нет Вы не опоздали. Приятно получать тёплые и самое главное искренние поздравления. Спасибо за цветы.

      Удалить

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