Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «bleachbit»
Меняем форму комментариев на Blogspot 2013-08-30 03:01:00
Не знаю, кому как, но мне давно не давала покоя стандартная форма комментариев на Blogspot. Так хотелось хоть немного её видоизменить. Не так давно набрела на сайт и нашла код, который для нас "чайничков" вставить не составит особого труда. Копируем код ниже и плавно переходим в черновик blogger- шаблон-настроить. В открывшемся дизайне шаблонов нажимаем-дополнительно-вставить СSS. Перед Вами откроется вкладка, куда необходимо вставить скопированный код. Смотрите на скриншоте
Далее жмем-применить к блогу-просмотреть блог-назад в blogger. Пример в этом блоге. #comments{overflow:hidden} #comments h4{display:inline;padding:10px;line-height:40px} #comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative} #comments h4,.comments .continue a{background:#50C806} #comments h4,.comments .user a,.comments .continue a{font-size:16px} #comments h4,.comments .continue a{font-weight:normal;color:#fff} #comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #50C806;border-right:20px solid transparent;width:0;height:0;line-height:0} #comments .avatar-image-container img{border:2} .comment-thread{color:#111} .comment-thread a{color:#777} .comment-thread ol{margin:0 0 20px} .comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#50C806} .comments .avatar-image-container,.comments .avatar-image-container img{width:48px;max-width:48px;height:48px;max-height:48px} .comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px} .comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #ddd;background:#f9f9f9;padding:10px} .comments .comments-content .comment{margin:15px 0 0;padding:0;width:100%;line-height:1em} .comments .comments-content .icon.blog-author{position:absolute;top:-12px;right:-12px;margin:0;background-image: url([URL=http://radikal.ru/fp/f9e9332a95154de285e58e8bba4dd609][IMG]http://s019.radikal.ru/i631/1308/c5/a91f379742c9.jpg[/IMG][/URL]);width:36px;height:36px} .comments .comments-content .inline-thread{padding:0 0 0 20px} .comments .comments-content .comment-replies{margin-top:0} .comments .comment-content{padding:5px 0;line-height:1.4em} .comments .comment-thread.inline-thread{border-left:1px solid #ddd;background:transparent} .comments .comment-thread.inline-thread .comment{width:auto} .comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #ddd;width:10px;height:0px} .comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0} .comments .comment-thread.inline-thread .comment-block{margin-left:48px} .comments .comment-thread.inline-thread .user a{font-size:13px} .comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px} .comments .continue{border-top:0;width:100%} .comments .continue a{padding:10px 0;text-align:center} .comment .continue{display:none} #comment-editor{width:103%!important} .comment-form{width:100%;max-width:100%}
Выделенное розовым фоном-это цвет #050C806, сейчас он зеленый, можете поменять на свой вкус. Так же можно изменить ширину(width) и высоту(height), по желанию. Только смотрите внимательно, чтобы и ширина и высота были пропорциональны. Прежде чем изменить, изучите внимательно цифры. Больше ничего менять не рекомендую, так как сама меняла, и лучше чем есть не стало, хотя если есть желание можете экспериментировать. Всё, меняем и наслаждаемся проделанной работой.
Посмотрите как изменить цвет фона текста; Как узнать скорость загрузки страниц;
Тэги: blogspot, комментарий, менять, форма
Меняем форму комментариев на Blogspot 2013-08-30 03:01:00
Не знаю, ...
+ развернуть текст сохранённая копия
Не знаю, кому как, но мне давно не давала покоя стандартная форма комментариев на Blogspot. Так хотелось хоть немного её видоизменить. Не так давно набрела на сайт и нашла код, который для нас "чайничков" вставить не составит особого труда. Копируем код ниже и плавно переходим в черновик blogger- шаблон-настроить. В открывшемся дизайне шаблонов нажимаем-дополнительно-вставить СSS. Перед Вами откроется вкладка, куда необходимо вставить скопированный код. Смотрите на скриншоте
Далее жмем-применить к блогу-просмотреть блог-назад в blogger. Пример в этом блоге. #comments{overflow:hidden} #comments h4{display:inline;padding:10px;line-height:40px} #comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative} #comments h4,.comments .continue a{background:#50C806} #comments h4,.comments .user a,.comments .continue a{font-size:16px} #comments h4,.comments .continue a{font-weight:normal;color:#fff} #comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #50C806;border-right:20px solid transparent;width:0;height:0;line-height:0} #comments .avatar-image-container img{border:2} .comment-thread{color:#111} .comment-thread a{color:#777} .comment-thread ol{margin:0 0 20px} .comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#50C806} .comments .avatar-image-container,.comments .avatar-image-container img{width:48px;max-width:48px;height:48px;max-height:48px} .comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px} .comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #ddd;background:#f9f9f9;padding:10px} .comments .comments-content .comment{margin:15px 0 0;padding:0;width:100%;line-height:1em} .comments .comments-content .icon.blog-author{position:absolute;top:-12px;right:-12px;margin:0;background-image: url([URL=http://radikal.ru/fp/f9e9332a95154de285e58e8bba4dd609][IMG]http://s019.radikal.ru/i631/1308/c5/a91f379742c9.jpg[/IMG][/URL]);width:36px;height:36px} .comments .comments-content .inline-thread{padding:0 0 0 20px} .comments .comments-content .comment-replies{margin-top:0} .comments .comment-content{padding:5px 0;line-height:1.4em} .comments .comment-thread.inline-thread{border-left:1px solid #ddd;background:transparent} .comments .comment-thread.inline-thread .comment{width:auto} .comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #ddd;width:10px;height:0px} .comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0} .comments .comment-thread.inline-thread .comment-block{margin-left:48px} .comments .comment-thread.inline-thread .user a{font-size:13px} .comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px} .comments .continue{border-top:0;width:100%} .comments .continue a{padding:10px 0;text-align:center} .comment .continue{display:none} #comment-editor{width:103%!important} .comment-form{width:100%;max-width:100%}
Выделенное розовым фоном-это цвет #050C806, сейчас он зеленый, можете поменять на свой вкус. Так же можно изменить ширину(width) и высоту(height), по желанию. Только смотрите внимательно, чтобы и ширина и высота были пропорциональны. Прежде чем изменить, изучите внимательно цифры. Больше ничего менять не рекомендую, так как сама меняла, и лучше чем есть не стало, хотя если есть желание можете экспериментировать. Всё, меняем и наслаждаемся проделанной работой.
Посмотрите как изменить цвет фона текста; Как узнать скорость загрузки страниц;
Тэги: blogspot, комментариев, меняем, форму
Переводчик текста на Blogspot 2013-08-26 04:44:00
Сегодня ...
+ развернуть текст сохранённая копия
Сегодня поговорим о гаджете переводчик, разработчиков Google, который обязательно должен быть на страницах нашего блога. Его можно вставить-дизайн-добавить гаджет-выбрать переводчик - настроить - сохранить. Я не буду писать о других сервизах, предоставляющих услуги перевода, информацию о них Вы без труда найдете в интернете. Почему именно переводчик Google-потому что это самый оптимальный вариант, лучшее качество перевода на более семидесяти языках всего мира. Существует ещё способ-как вставить такой гаджет в блог. Правда я не до конца поняла, чем они отличаются. Первый вставляется без редактирования Html кода, а вот второй вариант требует изменить шаблон. Форма переводчика и в том, и в другом варианте одинакова. Единственное, что во втором способе вы имеете возможность настроить виджет. Выбирать Вам, каким из них воспользоваться. Я расскажу подробнее о втором варианте с редактированием Html кода в шаблоне. Поверьте, там нет ничего сложного. Переходим на сайт Translate Google, и настраиваем переводчик 
Первое, что мы делаем-в текстовую строку пишем URL адрес блога без http://. Обязательно укажите - родной язык своего блога либо сайта. Режим отображения-я выбрала прямо в тексте, там ещё есть-вкладка и автоматический перевод. Далее настраиваем-отображение, то есть как будет выглядеть гаджет: вертикально, горизонтально или в виде раскрывающего списка. Посмотрите на все три варианта, предварительный просмотр сразу слева. В дополнительных настройках укажите-автоматически показывать панель перевода, кто не знает языка вашей страны. Вот этим пожалуй и отличаются эти два варианта вставки переводчика. Но согласитесь, аргумент весомый, если Ваш блог в поиске найдет кто-нибудь из зарубежных блоггеров или посетителей, текст блога сразу откроется на языке их страны., а вы получите посетителей. Так, немного отвлеклись. Нам осталось - получить код. Нажимаем и - видим два кода. Первый копируем и идем в шаблон-изменить шаблон. Быстренько ищем закрывающий тэг </head> и перед ним вставляем скопированный код. Переходим-просмотр-сохранить шаблон. Возвращаемся обратно и копируем второй код, который вставляем обычным - добавить гаджет. Открываем наш блог и видим установленный гаджет переводчика текста. Хочу обратить внимание, почему я выбрала именно этот вид отображения. Если кликните на слово-переводчик или Google, Вас автоматически перекинет на страницу сайта переводчика Google. То есть у Вас в блоге появляется возможность быстрого перевода текста, отдельных слов или целых предложений. На этом всё, пишите, комментируйте.
Почитайте как узнать скорость загрузки страниц блога;
Тэги: blogspot, переводчик, текст
Как создать Flush облако тэгов в блоге на Blogspot 2013-08-24 03:47:00
Продолжаем ...
+ развернуть текст сохранённая копия
Продолжаем тему создания облака тэгов в блоге. В предыдущем посте мы уже научились делать простое облако меток. Кто не читал, прошу перейти сюда. Я уже писала, что минус облака в том, что в нем отображаются все наши опубликованные сообщения. В этом посте предлагаю простой способ создания Flush облака, где мы можем настроить количество отображаемых меток. Стараюсь находить по возможности самые простые решения, чтобы не менять шаблон, так как Html код, для нас-это как ходить по джунглям. Итак приступим, выполняем те же действия. В черновике blogger нажимаем дизайн-добавить гаджет-добавить свой собственный, смотрите на скриншоте в предыдущем посте. Вставляем скопированный ниже адрес, смотрите, там в строке уже есть http:// так что удаляйте. http://alexdioso.github.com/LabelSphere/LabelSphere.xml
И точно также нажимаем-добавить по URL
Название придумайте свое: облако меток, облако тэгов или что-нибудь оригинальное, здесь уж включайте Вашу фантазию. Далее установите высоту облака и число отображаемых меток. Фон гаджета автоматически подстривается под фон Вашего блога. Просматривайте в предварительном просмотре, нажимайте - сохранить и располагайте внизу страницы. Проверила работу гаджета в браузере Опера, работает нормально, чего не скажешь об ИЕ, там вообще темный лес. Может потому, что у меня старая версия, или нужны дополнительные настройки. Я им редко пользуюсь, в основном Google, который тоже кстати последнее время чудит. На этом с облаками у меня всё. Я думаю Вы разберетесь, старалась объяснить понятным языком. Пример смотрите в этом блоге внизу-слева, и в этом блоге внизу, на другом фоне страницы. Спасибо за внимание и до новых встреч на страницах моего блога. Жду Ваши комментарии.
Почитайте как добавить гаджет Ярлыки в блог на Blogspot; Как создать простое облако тэгов в блоге на Blogspot;
Тэги: blogspot, flush, блоге, облако, создать
Как создать облако тэгов в блоге на Blogspot 2013-08-24 02:42:00
Добрый день ...
+ развернуть текст сохранённая копия
Добрый день друзья! Все вы видели на сайтах или блогах прокрутку тэгов или ещё можно назвать ключевых слов, в виде красивого облака. Давайте и мы сделаем такое облако для своего блога. В черновике blogger нажимаем - добавить гаджет, в открывшейся вкладке слева вверху - добавить свой собственный. Перед Вами откроется вот такое окно
Здесь нам предложат ввести URL адрес гаджета. Копируем адрес ниже и вставляем в строку, предварительно удаляем http:// нажимаем - добавить по URL.
http://b-cumulus.googlecode.com/svn/tags/3.0/b-cumulus.xml
Перед нами открывается окно
Вот здесь мы и займемся настройками нашего облака тэгов. Смотрим сверху - вниз. Настраивайте высоту, ширину, высоту облака. При необходимости поменяйте цвет фона облака, цвет шрифта, их там три, размер шрифта. Просматривайте в предварительном просмотре, нажимая - обновить. Воспользуйтесь генератором цветового кода. У Вас первоначально фон будет темный, у меня на скриншоте он изменен. После выполнения всех настроек нажимаете - сохранить. Расположите внизу страницы. Минус этого облака в том, что здесь будут отображаться все ключевые слова, и если их уже много, то будет смотреться не совсем эффектно. Я сделала для себя такое облако, но все посты получаются в одной точке. Так что сейчас напишу пост - как сделать Flush облако, в котором мы сможем настроить нужное количество отображаемых меток.
Почитайте как добавить гаджет Ярлыки в блог на Blogspot; Как создать Flush облако тэгов в блоге на Blogspot;
Тэги: blogspot, блоге, облако, создать, тэгов
Главная / Главные темы / Тэг «bleachbit»
|
Взлеты Топ 5
Падения Топ 5
|
