Супермаркет уникального контента - TextSale.ru

Форум поддержки копирайтеров и вебмастеров на TextSale.ru


Вернуться   Форум копирайтеров > Главная категория > Вопросы по работе системы

Ответ
 
Опции темы
Старый 28.09.2013, 21:24   #1
jozess
Новичок
 
Регистрация: 14.04.2011
Сообщений: 14
По умолчанию Новый дизайн на сайте Texsale

Весьма огорчен, что шрифт на сайте поменяли. Такое впечатление что его адаптировали под копирайтеров, которые в силу своей профессии потеряли зрение. Так вот, для таких случаев на клавиатуре есть комбинация клавиш Ctrl+ или просто + (в опере) - для изменения масштаба.

С таким шрифтом нельзя работать ниже расширения 1280. А я как заказчик, привык работать в пол окна (800 px). И очень разочарован в "криворукости верстальщика" который установил новый шрифт.
jozess вне форума   Ответить с цитированием
Старый 28.09.2013, 21:37   #2
Glafira
Местный
 
Регистрация: 10.01.2010
Сообщений: 665
По умолчанию Re: Новый дизайн на сайте Texsale

мы уже побурчали на эту тему в других ветках)
Glafira вне форума   Ответить с цитированием
Старый 29.09.2013, 08:16   #3
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

[B][CENTER]Избавляемся от огромного шрифта на TextSale[/CENTER][/B]

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

Технически проект TextSale иными словами страницы биржи TextSale масштабируемые, и рассчитаны на максимальную ширину в 1400px, что в принципе пригодно для просмотра сайта на любых мониторах. Однако левый и правый блок сайта имеют фиксированную ширину в 250px, поэтому масштабируется по ширине только основная часть контента, иначе середина сайта. Но на главной, основной части сайта отображаются и продаваемые статьи, их скриншоты нерезиновые, поэтому просматривать TextSale становится удобно только на широкоформатных экранах.

Большинство стандартных ПК-мониторов и ЖК-дисплеев ноутбуков имеют классическое расширение 1024х768px, предназначенное именно для работы за компьютером, при таком расширении сегодня работать на сайте TextSale становится весьма проблематично.

Если Вам не нравится крупный шрифт на сайте TextSale или другие элементы стиля, если новый дизайн биржи TextSale вызывает дискомфорт или просто мешает работать его можно легко и просто самостоятельно изменить.

Сразу же стоит обратить внимание и на конченый результат, проблема в том, что стили на сайте TextSale раскиданы между css и html, а заменить можно лишь в css, к тому же классов и идов на TextSale немного в принципе, поэтому всё изменить пока не получится.

Получить такой результат можно используя браузер Mozilla Firefox и расширение Stylish, это позволит заменить весь или часть style.css как TextSale так и любого другого сайта, настроив его под свой вкус и цвет.

Изначально скачайте браузер Mozilla Firefox, версия не принципиальна, на скриншотах использовалась 17.0.1. Затем с официального сайта скачайте расширение Stylish 1.3.3 это менеджер пользовательских стилей. Для того чтобы его установить перейдите через браузер Mozilla Firefox на страницу (https://addons.mozilla!org/ru/firefox/addon/stylish Замените ! - на точку) и нажмите зеленую кнопку 'Добавить в Firefox'.

После загрузки приложения браузер должен перезагрузиться, если этого не произошло, его следует перезапустить вручную, сразу после перезапуска внизу в левом углу строки состояния появится заначек приложения Stylish серая буква 'S';

Если строка состояния в Firefox отключена, включите её с клавиш Ctrl+/ или мышью 'Вид' - 'Панель инструментов' - 'Строка состояния', иначе 'Вигляд' - 'Панелi iнструментiв' - 'Панель додаткiв', после этого панель вместе со значком должна отобразиться в браузере;

Через Mozilla Firefox откройте страницу TextSale, нажмите на значок Stylish, на букву 'S', далее - 'Написать новый стиль' - 'Для textsale' и у Вас появится следующее окно - 'новый стиль':

В поле названия впишите TextSale, поле метки заполнять необязательно, все, что ниже в окне под кнопкой 'Вставить' сотрите, затем скопируйте и вставьте туда следующие стили:

[COLOR="Green"][SIZE="1"]*namespace url(http://www.w3!org/1999/xhtml);
*-moz-document domain("www.textsale!ru"), domain("textsale!ru") {

body { /* Основа контента */
background: #FFFFFF url('http://www.textsale!ru/divhead5.gif') !important; /* Ссылка на картинку фона верхней тени основной страницы, не использовалась, для удаления просто сотрите ссылку */
background-repeat: repeat-x !important; /* Дублирование картинки по горизонтали */
max-width: 1024px !important; /* Максимальная ширина сайта */
font-family: Arial !important; /* Шрифт текста */
font-size:12px !important; /* Размер основного шрифта */
margin: 0px !important; /* Без внешних отступов */
padding: 0px !important; /* Без внутренних отступов */
margin-left:auto !important; margin-right:auto !important; /* Выравнивание сайта по середине окна браузера */
margin-top: -1px !important; /* Пиксельный вынос страницы вверх за окно */}

a:link, a:visited { /* Ссылки и посещённе ссылки */
font-family: Arial !important; /* Шрифт ссылок */
color:#00457B !important; /* Цвет ссылок */
text-decoration: none !important; /* Не подчеркивать не выделенные ссылки */ }

a:hover { /* Ссылки при выделении */
text-decoration: underline !important; /* Подчеркивать ссылки */ }

.ramka5 { /* Шапка, рекламные и информационные блоки */
background: #ffffff; url('http://www.textsale!ru/img/backtopy.gif') !important; /* Цвет и картинка фона */
background-repeat: repeat-x !important; /* Дублирование картинки по горизонтали */
border-radius: 3px !important; /* Округление углов */
border: 1px solid #CCCCCC !important; /* Рамка */
font-family: Trebuchet MS, Arial !important; /* Шрифт текста */
font-style: normal !important; /* Стиль шрифта */
font-size: 12px !important; /* Размер шрифта */
font-weight: 700px !important; /* Стандартная жирность текста */
padding: 10px !important; /* Отступы от краев до текста */
margin: 0px !important; /* Без внешних отступов */ }

.noramka { /* Левый блок сайта */
background: #FFFFFF url('http://www.textsale!ru/divhead5.gif') !important; /* Цвет и картинка фона */
background-repeat: repeat-x !important; /* Дублирование картинки по горизонтали */
border:0px solid #FFFFFF !important; /* Без рамки */
font-family:Arial !important; /* Шрифт текста */
font-size: 12px !important; /* Размер шрифта */
padding: 10px !important; /* Отступы от краев до текста */
margin: 0px !important; /* Без внешних отступов */ }

.mwnoramka { /* Правый блок сайта */
width: 205px !important; /* Ширина блока */
background: #e7ebee !important; /* Цвет фона */
border:1px solid #CCCCCC !important; /* Параметры рамки */
border-radius: 0px !important; /* Без скругления */
font-family:Arial !important; /* Шрифт текста */
font-size: 12px !important; /* Размер шрифта */
text-align: left !important; /* Выравнивание текста */
padding-top:24px !important;/* Отступ от верха до текста */
margin: 0px !important; /* Внешние отступы */ }

#middleblock { /* Основной, средний блок сайта */
max-width: 590px !important; /* Минимальная ширина блока */
min-width: 590px !important; /* Максимальная ширина блока */
background: #FFFFFF url('http://www.textsale!ru/divhead5.gif') !important; /* Цвет и картинка фона */
background-repeat: repeat-x !important; /* Дублирование картинки по горизонтали */
font-size: 12px !important; /* Размер шрифта */
overflow: hidden !important; /* Скрыть все что за пределами блока, не влазит пустое поле скриншота статей, поэтому и hidden к месту */ }

.arttitle { /* Стиль заголовков статей и раздела Ничего не подходит */
font-family: Arial !important; /* Шрифт */
border: 0px solid black !important; /* Без рамки */
border-bottom: none !important; /* Без бордера снизу */
padding: 0px !important; /* Без отступов вокруг текста */
display: inline !important; /* Как встроенный элемент */
font-weight: 700px !important; /* Стандартная жирность текста */
font-size: 20px !important; /* Размер шрифта */
margin: 0 !important; /* Без внешних отступов */ }

.messagewindow { /* Блоки в профиле */
background: #EFEFEF !important; /* Цвет фона */
font-family: Arial !important; /* Шрифт текста */
font-size: 12px !important; /* Размер шрифта */
text-align: left !important; /* Выравнивание текста */
border: 1px solid #AAAAAA !important; /* Параметры рамки */
border-radius: 0px !important; /* Округление углов */
padding: 10px !important; /* Внутренний отступ */
margin: 0px !important; /* Без внешних отступов */ }

.formtable { /* Шрифт таблицы данных статей */
font-family: Arial !important; /* Шрифт ссылок */
font-size: 12px !important; /* Размер шрифта */ }

.formtablesmall { /* Блок статей на странице профиля */
font-family: Arial !important; /* Шрифт текста */
font-size: 10px !important; /* Размер шрифта */ }

.table2 { /* Блок ваши авторские статьи в личном профиле*/
font-family:Arial !important; /* Шрифт текста */
font-size: 10px !important; /* Размер шрифта */ }

.trb { /* Цена статьи */
font-family: Arial !important; /* Шрифт текста */
font-size: 10px !important; /* Размер шрифта */
vertical-align: middle !important; /* Выравнивание по вертикали */
text-align: right; /* Выравнивание по горизонтали */ }

.trnb { /* Символов в статье и цена за штуку */
font-family: Arial !important; /* Шрифт текста */
font-size: 10px !important; /* Размер шрифта */
vertical-align: middle !important; /* Выравнивание по вертикали */
text-align: right; /* Выравнивание по горизонтали */ }

img { /* Все картинки на сайте вставленные через img */
max-width: 650px !important; /* Максимальная ширина картинок, важна для скриншотов статей */}

h1 { /* Первый класс заголоаков */
font-size: 20px !important; /* Размер шрифта */
font-weight: 700px !important; /* Стандартная жирность текста */ }

h2 { /* Второй класс заголоаков */
font-size: 16px !important; /* Размер шрифта */
font-weight: 700px !important; /* Стандартная жирность текста */ }

li { /* Класс используется для некоторых ссылок */
font-size: 12px !important; /* Размер шрифта */
font-weight: 700px !important; /* Стандартная жирность текста */ }

input[type=text] { /* Поля ввода текста */
font-family:Arial !important; /* Шрифт текста */
font-size: 12px !important; /* Размер шрифта */
text-align: left !important; /* Выравнивание текста */}

input[type=submit] { /* Кнопки сумбит */
font-family:Arial !important; /* Шрифт текста */
font-size: 12px !important; /* Размер шрифта */}

.details {
font-weight: bold !important;
font-size:12px !important;}

}[/SIZE][/COLOR]

Читайте далее…
ArtyrS вне форума   Ответить с цитированием
Старый 29.09.2013, 08:19   #4
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

Продолжение…

[COLOR="Red"]ВАЖНО:[/COLOR] Правилами форума запрещено передавать ссылки, сначала скопируйте стили в текстовый редактор, в стилях вы найдете 7 ссылок:
http://www.w3!org/1999/xhtml
www.textsale!ru
textsale!ru
http://www.textsale!ru/divhead5.gif - введена 3 раза
http://www.textsale!ru/img/backtopy.gif
[COLOR="Red"]В каждом url каждой ссылки замените Восклицательный знак ! - на точку[/COLOR]
В начале стилей перед параметрами [COLOR="Red"]namespace и -moz-document domain звездочку замените на собачку[/COLOR], как в емейл-адресах


После вставки нажмите 'Сохранить' иначе 'Зберегти' и снова в браузере откройте страницу textsale, по умолчанию собственные стили отключены, для того чтобы их включить кликните по значку 'Stylish' по букве 'S'. Теперь в самом низу маленького окошка появился тег с названием нашего стиля TextSale. Нажмите на 'TextSale' так чтобы рядом с ним появилась галочка, а затем примените этот выбранный стиль к странице сайта, для этого вновь нажмите на букву 'S', а затем на 'Включить все стили' или 'Увiмкнути всi стилi'.

После применения стиля, заначек 'S' из бело-серой буквы превратится в цветную, если здесь что-то не получается, попробуйте включить 'Управления стилями', там есть кнопки 'Применить', 'Отключить', 'Удалить' созданные стили;


Естественно этот способ не решает проблемы крупного шрифта на сайте, а лишь позволяет изменить дизайн textsale только для Вас;

У каждого атрибута каждого класса есть комментарий, вставлять стили в окно стиля можно вместе с комментариями, но здесь используются не все классы, неиспользуемые подгружаются с главного сервера сайта. С этими стилями сайт textsale фиксирован по ширине в 1024рх, использован меньший радиус округления, изменены отступы, отменена картинка фона правой ячейки сайта (залита цветом) и внесены другие изменения. С учетом прописанных к стилям комментарий Вы, даже ничего не зная в css сами все интуитивно поймете и сможете подправить дизайн сайта textsale и практически любого другого сайта, так как Вам направится!

Со скринами тоже беда, добавляются только с расширением 800x600, поэтому качество хреновое, но прежде чем делать все равно взгляните:

Продажа статьи до:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED%20%B93.png
После:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED%20%B98.png

Топ копирайтеров до:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED%20%B92.png
После:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED-%B97.png

Профиль до:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED%20%B94.png
После:
http://www.textsale!ru/uploads/3026/3026320_%D1%EA%F0%E8%ED%20%B99.png

[COLOR="Red"]В каждом url замените Восклицательный знак ! - на точку[/COLOR]
ArtyrS вне форума   Ответить с цитированием
Старый 29.09.2013, 08:25   #5
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

[B][CENTER]Я не дождался ответа на первое сообщение и уже было укомплектовал решение в статью, но хрен с ней со статьей, здесь почти что ничего не менял, поэтому делайте кому надо, для себя я уже всё давно сделал![/CENTER][/B]
[COLOR="Red"]Убедительная просьба не срать в этой новой теме, пишите по делу, хорошо![/COLOR]
ArtyrS вне форума   Ответить с цитированием
Старый 29.09.2013, 10:28   #6
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

Перезалил скриншоты:
Топ
№1.1 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED%20%B92.png
№1.2 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED-%B92.2.png
Статьи
№2.1 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED%20%B93.png
№2.2 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED%20%B93.2.png
Аккаунт
№3.1 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED%20%B94.png
№3.2 http://www.textsale!ru/uploads/3028/3028615_%D1%EA%F0%E8%ED%20%B94.2.png
! – Заменить на точки
ArtyrS вне форума   Ответить с цитированием
Старый 29.09.2013, 13:30   #7
jozess
Новичок
 
Регистрация: 14.04.2011
Сообщений: 14
По умолчанию Re: Новый дизайн на сайте Texsale

[B]ArtyrS[/B], спасибо.
jozess вне форума   Ответить с цитированием
Старый 30.09.2013, 09:04   #8
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

[QUOTE=jozess;188020][B]ArtyrS[/B], спасибо.[/QUOTE]

Не за что, может быть я неправ, ведь особого недовольства по поводу крупного шрифта и не было вовсе, может быть мы с вами просто от моды отстаем!?
ArtyrS вне форума   Ответить с цитированием
Старый 30.09.2013, 09:15   #9
Грифон
Заблокирован
 
Регистрация: 20.05.2010
Сообщений: 5,293
По умолчанию Re: Новый дизайн на сайте Texsale

ну, кому-то оно и не мешает вовсе...
Грифон вне форума   Ответить с цитированием
Старый 30.09.2013, 09:54   #10
ArtyrS
Новичок
 
Регистрация: 27.09.2013
Сообщений: 16
По умолчанию Re: Новый дизайн на сайте Texsale

[QUOTE=Грифон;188032]ну, кому-то оно и не мешает вовсе...[/QUOTE]

Верю, но я не видел ни одного похвального отзыва, только критику
ArtyrS вне форума   Ответить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Выкл.
Смайлы Вкл.
[IMG] код Выкл.
HTML код Выкл.



Текущее время: 07:43. Часовой пояс GMT +3.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2018, vBulletin Solutions, Inc. Перевод: zCarot