Как убрать ховер-подчеркивание якорей

Главные вкладки

Аватар пользователя alexo alexo 5 сентября 2019 в 16:32

Здравствуйте! У меня якоря при ховере выделяются и подчеркиваются так же как ссылки.
Хочу убрать, чтобе не путать пользователей и чтобы они зря не щелкали, но не могу найти, как. Видимо нужно найти какой-то класс, который был бы у якоря, но не был бы у ссылки, и ему прописать стиль? Тема responsive bartik.
Вроде это по умолчанию в bartik прописано, но не могу найти, какие стили править. с F12 тоже не могу найти (скриншот).
Кто пользовался бартиком, подскажете, как это исправить?

Лучший ответ

Аватар пользователя ivnish ivnish 5 сентября 2019 в 20:37
1

Ну вот почти и ответ. Переключите редактор в режим "источник" (где html код) и там можно будет к этим якорям добавить класс

Комментарии

Аватар пользователя ivnish ivnish 5 сентября 2019 в 16:37
1

У меня якоря при ховере выделяются и подчеркиваются так же как ссылки.

Ну собсна якорь и является ссылкой

Добавь к своим якорям какой-нибудь класс и в CSS задай ему персональные стили

Аватар пользователя alexo alexo 5 сентября 2019 в 16:57

Спасибо. А в каком шаблоне добавлять классы и как правильно сделать, чтобы в css мои настройки перекрыли общие для ссылок настройки?

Аватар пользователя alexo alexo 5 сентября 2019 в 19:16

Спасибо. Я все равно не могу понять:
1) мне нужно что-то добавлять в шаблоне темы или только в CSS? Давно не имею дела с дизайном. Для якоря в бартике используется предустановленный тег или нужно как-то пометить, присвоить в шаблоне класс, чтобы уже потом для этого класса стиль добавить? как мне узнать какой класс использовать?
У кого бартик стоит тема, как у Вас там стили для якорей сделаны?

2)когда я уже буду знать, для какого класса стиль добавлять, как мне стиль прописать правильно для него, чтобы моя запись перекрыла стиль для ссылки?

Аватар пользователя alexo alexo 5 сентября 2019 в 19:55

Через F12 вижу то, что на скриншоте в описании этой темы.

element.style {
}
a {
    color: #0071B3;
}
body, #site-slogan, .ui-widget, .comment-form label {
    font-family: 'Calibri',Arial,"Tahoma",sans-serif;
}
body, body.overlay {
    <del>color: #3b3b3b;</del>
}
body, #site-slogan, .ui-widget, .comment-form label {
  <del>  font-family: 'Calibri',Arial,"Tahoma",sans-serif;</del>
}
body {
    line-height: 1.5;
    font-size: 87.5%;
    word-wrap: break-word;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}
html {
   <del> color: -internal-root-color;</del>
}

Зачеркивание не отражается только здесь, а тег зачеркивания вручную добавленный все равно в теге кода не работает (в общем то, что между del зачеркнуто). Как это на самом деле выглядит видно на скриншоте в описании темы
Или еще где-то посмотреть?

Аватар пользователя alexo alexo 5 сентября 2019 в 20:24

У меня готовая тема responsive bartik, поэтому я и спрашиваю у тех кто пользовался ею, так как не знаю, что и где мне нужно искать в файлах шаблонов? Если никто не помнит, как там сделано, то тогда как мне найти код html или куда его добавить? Т.е. если код уже есть и его только нужно найти и для классов прописать стили, то как найти нужные классы?
Искать файлы шаблонов, где есть какие-то классы из перечисленных при просмотре через F12?
Или может сюда в тему выложить файлы шаблонов?

Аватар пользователя alexo alexo 5 сентября 2019 в 20:33

Если Вы имеете в виду, как якори были добавлены на конкретную страницу, то они добавлены были в редакторе с помощью кнопки

Аватар пользователя ivnish ivnish 5 сентября 2019 в 20:37
1

Ну вот почти и ответ. Переключите редактор в режим "источник" (где html код) и там можно будет к этим якорям добавить класс

Аватар пользователя alexo alexo 5 сентября 2019 в 20:49

А как правильно добавить класс?
Например, у меня в режиме "истоник"
"

<p>
        <a id="Название якоря" name="Название якоря"><font color="#0782c1">Имя якоря в тексте</font></a></p>

"
где здесь писать?
Или можно id прямо использовать в css, если у меня мало якорей и все равно вручную это делать?
Т.е. какого-то особого тега кнопка якоря не добавляет? Только id ссылки делает? Т.е. тогда теоретически я могу добавить свою кастомную кнопку для создания якорей, которая будет класс всем якорям еще добавлять и тогда мне не придется вручную каждый якорь править и можно будет один раз для всех стиль сделать?
Или все же есть какой-то способ в шаблоне как-то класс дописать для всех якорей?

Аватар пользователя ivnish ivnish 5 сентября 2019 в 20:56
1

Лучше вместо id использовать class, например < a class="my-super-class"...

А в CSS файле задайте этому классу нужные стили, которые будут применяться только к элементам с этим классом

Аватар пользователя alexo alexo 17 сентября 2019 в 15:57

Возникли еще 3 мысли:
1)что если как-то отредактировать плагин, который отвечает за кнопку якорей у CKeditor (т.е. вписать это чтобы кнопка редактора сразу добавляла как вы пишете < a class="my-super-class"... )?
Какой файл и где искать?
В файле anchor.js (в sites/all/libraries/ckeditor/plugins/link/dialogs) вот такой код

CKEDITOR.dialog.add("anchor",function(c){function e(b,a){return b.createFakeElement(b.document.createElement("a",{attributes:a}),"cke_anchor","anchor")}return{title:c.lang.link.anchor.title,minWidth:300,minHeight:60,onOk:function(){var b=CKEDITOR.tools.trim(this.getValueOf("info","txtName")),a={id:b,name:b,"data-cke-saved-name":b};this._.selectedElement?this._.selectedElement.data("cke-realelement")?(b=e(c,a),b.replace(this._.selectedElement),CKEDITOR.env.ie&&c.getSelection().selectElement(b)):this._.selectedElement.setAttributes(a):
(b=(b=c.getSelection())&&b.getRanges()[0],b.collapsed?(a=e(c,a),b.insertNode(a)):(CKEDITOR.env.ie&&9>CKEDITOR.env.version&&(a["class"]="cke_anchor"),a=new CKEDITOR.style({element:"a",attributes:a}),a.type=CKEDITOR.STYLE_INLINE,a.applyToRange(b)))},onHide:function(){delete this._.selectedElement},onShow:function(){var b=c.getSelection(),a;a=b.getRanges()[0];var d=b.getSelectedElement();a.shrink(CKEDITOR.SHRINK_ELEMENT);a=(d=a.getEnclosedNode())&&d.type===CKEDITOR.NODE_ELEMENT&&("anchor"===d.data("cke-real-element-type")||
d.is("a"))?d:void 0;var f=(d=a&&a.data("cke-realelement"))?CKEDITOR.plugins.link.tryRestoreFakeAnchor(c,a):CKEDITOR.plugins.link.getSelectedLink(c);if(f){this._.selectedElement=f;var e=f.data("cke-saved-name");this.setValueOf("info","txtName",e||"");!d&&b.selectElement(f);a&&(this._.selectedElement=a)}this.getContentElement("info","txtName").focus()},contents:[{id:"info",label:c.lang.link.anchor.title,accessKey:"I",elements:[{type:"text",id:"txtName",label:c.lang.link.anchor.name,required:!0,validate:function(){return this.getValue()?
!0:(alert(c.lang.link.anchor.errorName),!1)}}]}]}});

2)Или может быть создать кастомную кнопку для добавления тэга якоря с кастомным дополнительным текстом (или так)

3)еще вариант сразу в CKEdtotor стили добавлять (но так как у всех якорей нужно убрать подчеркивание, то нет смысла это каждый раз вручную делать, поэтому, я думаю, каждый раз каждому якорю стиль добавлять, это, наверное, кривоватый вариант)

Аватар пользователя alexo alexo 21 сентября 2019 в 14:36

Делаю все же вручную, но почему-то не работает. Наверное где-то туплю в простых тэгах

а в самой ноде в режиме источник так делаю

Все равно якоря подчеркиваются
Страницу обновляю с f5, кэш очищаю
Как правильно исправить?

Аватар пользователя alexo alexo 23 сентября 2019 в 14:33

Спасибо.
Т.е. стиль так прописать?

a.my_link_class a {
        {
        color: blue;
  text-decoration: none;
}
       
a.my_link_class a:hover {
        color: blue;
  text-decoration: none;
}

Почему-то не работает. Может что-то еще?

Аватар пользователя ivnish ivnish 23 сентября 2019 в 15:06
1
a.my_link_class {
  color: blue;
  text-decoration: none;
}
       
a.my_link_class:hover {
  color: blue;
  text-decoration: none;
}

Потому что вы пишете бездумно.

Аватар пользователя alexo alexo 23 сентября 2019 в 19:14

Спасибо. Просто я "на Вы" с CSS, очень редко что-то делаю самостоятельно со стилями, у меня в нем уровень "читаю со словарем, говорю по разговорнику" и очень страдает синтаксис. И, так как редко с этим сталкиваюсь, для больших объемов ищу специалиста. Но видимо и для этого тоже придется искать.
После Вашей самой первой рекомендации добавить класс у меня была попытка сделать по этой инструкции. Теперь уже все следующие, рекомендованные здесь варианты пробую, но все же сохраняется где-то косяк.
Еще к тому же и аггрегация была включена. Правда теперь выключена и после этого уже и кэш почищен, и крон был запущен на всякий случай, но все равно не работает. Не знаю даже, где искать.
Если никаких подсказок больше нет, то чтобы тем лишних не делать по поиску специалистов, если кто-то готов полезть и разобраться, в чем там дело, то сколько это будет стоить, пишите в личку, пожалуйста, я могу скинуть папку с моей темой.