Поддержка Проблемы и решения Некликабельные ссылки и свой стиль для пустых категор

  • Для вывода списка категорий я использую виджет плагина My Category Order.

    В сайтбар у меня выводится список категорий. Включая пустые категории.
    Я имею возможность(Hide Empty) не показывать в сайтбаре пустые категории, но мне нужно их оставить.

    Т.к. они пустые я бы очень хотел, чтоб они:
    1) Были некликабельными.
    Подробнее: Ссылка вида «#«. Ну, знаете 🙂

    2) Имели свой стиль.
    Подробнее: Сейчас они синего цвета. А я бы хотел в css сделать их серыми. Для этого, как понимаете, нужно каким-то образом добавить что-то типо empty-cat в конец атрибута class — <li class="cat-item cat-item-65 empty-cat">

    Очень жду вашей помощи, т.к. у самого не получилось решить данную задачу.

Просмотр 12 ответов — с 16 по 27 (всего 27)
  • dddobriak, я бы на месте админа сменил бы Вам ник на zzzluka)

    Мой пост ещё не готов между прочем. Возникли некоторые проблемы(ссылка типа «#» ведёт на верх страницы), которые я сейчас решаю самостоятельно. Одно решение(использовать JS) я уже нашёл. Сейчас думаю о решении получше. Когда буду готов — отпишусь.

    dddobriak, идите в другое место людей ссорьте…
    Вообще, сколько всего нужно написать, чтоб полностью от Вас оборонится?
    Что мне ещё написать? Ну да, уточню, что проблема с «#» — это моя ошибка в постановке задания. Это и так всем понятно. И, т.к. я уже про это написал, Вам не удастся написать, что-то типо того, что мне помогли, а я ещё чем-то недоволен.

    А Сергей, как всегда, пишет хороший работающий код.

    Админу необязательно мне его менять, этот ник имеет историческую важность, значительно превышающую ту, которая вам кажется на первый взгляд, а в остальном, ничего не понял что вы написали. Если вам не нравится что при нажатии на ссылку с # страница прыгает вначало, я бы назвал это уже некими симптомами паранойи, завязанной на перфекционизме вещей в тех случаях, где он совершенно необязателен. Например ссылка перестанет вести страницу наверх, если убрать из нее атрибут href=»#», однако не уверен что вас устроит это решение, т.к. в таком случае при наведении на нее из адресной строки перестанет показываться #, что собсна уже нарушает эстетичность всей задачи.

    Можно даже лучше сделать, просто что б не прыгало наверх, как-то ну, не до конца эстетично. Предлагаю к классу empty-cat подвязать скрипт типа лайтбокса, а в качестве examples выводить текст следующего содержания:

    Дорогие друзья! Я, как создатель социального проекта(речь не про соц. сеть), безумно рад что вы решились таки тыкнуть на этот пункт, но к сожалению он тут пока так, просто что б вы видели что такая категория есть, а сообщений в ней нет пакашта. Спасибо вам огромное, жмите исчо 🙂

    Sergey Biryukov, как я теперь понял — ссылка «#» не подходит.

    Я решил, что надо подправить Ваш код и заменить тег a на тег span. (В css добавил cursor: pointer;, чтоб это было очень похоже на некликабельную ссылку 🙂 )

    А вот и код:

    function delink_empty_categories($output) {
    	$categories = get_categories('hide_empty=0');
    
    	foreach ( (array) $categories as $category ) {
    		if ( empty($category->count) ) {
    			$output = preg_replace("/(cat-item-{$category->term_id})\"><a .+?>{$category->name}<\/a>/", "$1 empty-cat\"><span>{$category->name}</span>", $output);
    		}
    	}
    
    	return $output;
    }
    add_filter('wp_list_categories', 'delink_empty_categories');

    Казалось бы, что всё хорошо. Но нет, подделка не удалась(
    Если кликать на эту «ссылку», то она выделяется как текст, т.к. она и есть текст) Мне это не нравится(

    Я подумал, а что если просто убрать атрибут href из Вашего кода и получится <a>...</a>. Попробовал. В итоге: Во-первых, я не знаю на сколько это правильно с точки зрения html, а во-вторых это подобие ссылки тоже стало выделяться при нажатии(как и в случае с span).

    Вот такие дела…

    Что посоветуете?

    Любое имя якоря без самого якоря не будет вести страницу наверх, вот так например:<a href="#oldschoolparanoiamanwatchingforyou"></a>

    dddobriak, Вы правы.
    Теперь я хочу большего) Думаю, было бы вообще идеально, если бы это не было ссылкой. Т.е. в адресной строке ничего не менялось.

    Пока что 2 очень разных варианта неидеального решения проблемы:
    1) Сделать ссылку с якорем типа #oldschoolparanoiamanwatchingforyou
    Проблема: добавление в адресную строку чего-то лишнего.

    2) Сделать подделку ссылки использую тег span и св-во cursor: pointer;.
    Проблема: При клике на эту подделку она выделяется как текст, т.к. и является текстом. Учитывая очень светлый дизайн сайта — это выделение очень не красиво.

    Я уверен, что существует идеальный вариант, при чём без использования JS)

    1) Сделать ссылку с якорем типа #oldschoolparanoiamanwatchingforyou
    Проблема: добавление в адресную строку чего-то лишнего.

    2) Сделать подделку ссылки использую тег span и св-во cursor: pointer;.
    Проблема: При клике на эту подделку она выделяется как текст, т.к. и является текстом. Учитывая очень светлый дизайн сайта — это выделение очень не красиво.

    1) Человек нажал на якорь — ему в адресной строке показали имя якоря и больше ничего лишнего.
    2) Человек кликнул два раза на текст — ему выделили текст. Очень красиво, а главное понятно.

    Надо написать этим производителям браузеров, зачем они такие дурацкие и неуместные штуки сделали… ну дурачьеееее

    1) Человек нажал на якорь — ему в адресной строке показали имя якоря и больше ничего лишнего.

    Якорь, по своему предназначению, не для таких дел используется.

    2) Человек кликнул два раза на текст — ему выделили текст. Очень красиво, а главное понятно.

    По сути то это текст. Мы же подделку делаем! Хватит прикалываться)

    Предлагаю всем собраться организованно и подать заявку в W3C для выведения нового параметра — сцылко которое не сцылко, а подделко такое, а пока без js можно еще так сделать, с использованием однопиксельного прозрачного гифа, во

    <!-- html -->
    <a href="#">...</a><span></span>
    /*css*/
    li, li a {postiton:relative; z-index:0;}
    li span {background:url(images/blank.gif); position:absolute; left:0; top:0; width:/*ширина меню*/; height:/*длина пункта*/; z-index:99;}

    Sergey Biryukov, dddobriak, спасибо за помощь. Без вас мне было бы очень тяжело всё это сделать.

    Прошу не думать, что у меня нет желания с чем-то разбираться.
    Я на себя взял слишком много разнообразных дел и, потому, не имею возможности выделять больше сил на какуе-то конкретную проблему.

    Хочу задать ещё 1 небольшой странный вопрос.

    а пока без js можно еще так сделать, с использованием однопиксельного прозрачного гифа, во

    А это на SEO никак не отразится? Поисковый робот может определить, что текст перекрыт и занизить из-за этого оценку сайту? q_q

    css поисковый робот не индексирует

Просмотр 12 ответов — с 16 по 27 (всего 27)
  • Тема «Некликабельные ссылки и свой стиль для пустых категор» закрыта для новых ответов.