Помощь увелиние / уменьшение размера шрифта WP 2.7+

Alex KGB · 14 Янв 2011

На различных блогах видел кнопки для изменения размера шрифта статьи (основного текста). Реализованы они по-разному. У одних три буквы А- А А+, у других - кегль 8 10 12 14 16.

Каким плагином предпочтительно это сделать?
Один вариант я нашел, но он мне не очень нравится

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

Для просмотра ссылки Войди или Зарегистрируйся
Версия вордпресса на сайте будет 2.7 или выше.

Conwell · 15 Янв 2011

Зачем создавать дополнительную нагрузку на сервер обратывая дополнительные команды в плагине, когда можно сделать вот так вот:
Использовать переменную которая будет отвечать за размер шрифта,
1. прописываем проверку на ее наличие в шаблоне в самом начале до вывода doctype

PHP:

if(!$_GET['FontSize']){ $FontSize = 'font-medium';} else {$FontSize = $_GET['FontSize'];}

2. прописываем класс для body:

HTML:

<body class="<?php echo $FontSize;?>">

3. делаем ссылки для смены класса body

HTML:

<ul>
<li class="smallfont"><a href="?FontSize=font-small" title="Small Font"></a></li>
<li class="normalfont"><a href="?FontSize=font-medium" title="Normal Font"></a></li>
<li class="largefont"><a href="?FontSize=font-large" title="Large Font"></a></li>
</ul>

все.
в CSS шаблона прописываем три класса с разными размерами шрифтов

ShoxMaster · 15 Янв 2011

Conwell написал(а):
Зачем создавать дополнительную нагрузку на сервер

Пожалуй вырву из контекста это и предложу альтернативу на jQuery, которая будет работать на стороне клиента:

HTML:

$(document).ready(function(){
   var originalFontSize = $('html').css('font-size');
   $(".resetFont").click(function(){
      $('html').css('font-size', originalFontSize);
   });
   $(".increaseFont").click(function(){
      var currentFontSize = $('html').css('font-size');
      var currentFontSizeNum = parseFloat(currentFontSize, 10);
      var newFontSize = currentFontSizeNum*1.2;
      $('html').css('font-size', newFontSize);
      return false;
   });
   $(".decreaseFont").click(function(){
      var currentFontSize = $('html').css('font-size');
      var currentFontSizeNum = parseFloat(currentFontSize, 10);
      var newFontSize = currentFontSizeNum*0.8;
      $('html').css('font-size', newFontSize);
      return false;
   });
});

Нужно прописать только класы для кнопок уменьшения/увеличения. Но есть один серьёзный недостаток - размер текущего шрифта нужно сохранить в cookies и во время обработки (document).ready вытащить размер текста, который использовался раньше.

Alex KGB · 15 Янв 2011

Conwell написал(а):
Зачем создавать дополнительную нагрузку на сервер обратывая дополнительные команды в плагине, когда можно сделать вот так вот:
Использовать переменную которая будет отвечать за размер шрифта,
1. прописываем проверку на ее наличие в шаблоне в самом начале до вывода doctype

PHP:

if(!$_GET['FontSize']){ $FontSize = 'font-medium';} else {$FontSize = $_GET['FontSize'];}

2. прописываем класс для body:

HTML:

<body class="<?php echo $FontSize;?>">

3. делаем ссылки для смены класса body

1. А разве будет что-либо корректно работать в самом верху файла темы header.php перед <!DOCTYPE html PUBLIC ... >, как быть с валидацией ?
Оно должно быть, наверно таким:

PHP:

 <?php> if(!$_GET['FontSize']){ $FontSize = 'font-medium';} else {$FontSize = $_GET['FontSize'];} <?>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head ...

2. Класс body и ссылки прописывать в CSS?
3. Как прикрутить кнопки для управления к теме?

Conwell · 15 Янв 2011

Alex KGB написал(а):
1. А разве будет что-либо корректно работать в самом верху файла темы header.php перед <!DOCTYPE html PUBLIC ... >, как быть с валидацией ?
Оно должно быть, наверно таким:

PHP:

<?php> if(!$_GET['FontSize']){ $FontSize = 'font-medium';} else {$FontSize = $_GET['FontSize'];} <?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>> <head ...

2. Класс body и ссылки прописывать в CSS?
3. Как прикрутить кнопки для управления к теме?

1. При чем тут валидация и обработка файла шаблона PHP? PHP обрабатывается на стороне сервера, дальше отдается только результат. Правильнее будет вот так:

PHP:

<?php if(!$_GET['FontSize']){ $FontSize = 'font-medium';} else {$FontSize = $_GET['FontSize'];} ?><!DOCTYPE ...

разница в обрамлениях скобками.
2. именно так.
3. просто вставить приведенный код куда-то в тело шаблона.

Помощь увелиние / уменьшение размера шрифта WP 2.7+

Alex KGB

Гуру форума

Conwell

Постоялец

ShoxMaster

Постоялец

Alex KGB

Гуру форума

Conwell

Постоялец