Всички разбираме, че понякога е по-удобно да отваряте връзки в текущия прозорец, а понякога в нов. Аз лично се придържам към едно просто правило в повечето проекти - ако връзката е вътрешна (в рамките на сайта), то по подразбиране тя се отваря в текущия прозорец, а външните връзки, водещи някъде към други сайтове, отварят нови прозорци (табове) по подразбиране.
...
целевият атрибут не е посочен или е посочен като target="_self" , тогава документът се отваря в текущия прозорец на браузъра и ако на връзката е присвоен атрибут във формата target="_blank" , документът се отваря в нов прозорец .
Но тогава възниква въпросът - как може потребителят да направи разлика между тези 2 вида връзки, без да кликне върху тях или да погледне HTML кода на страницата?
Най-логичното е, ако CSS дизайнът на двата типа линкове е различен, ето опция, при която линкове с target="_blank" се подчертават с удебелен шрифт:
A ( font-weight:expression((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "bold" : "normal"); ) a ( font-weight:bold ;)
Тук, както често се случва, трябва да вземете под внимание Internet Explorer и другите браузъри; първото ръководство за стил е за IE, а второто е за други браузъри.
По подобен начин можете да експериментирате с някои други свойства на CSS, като например подчертаване на текста:
A ( text-decoration:expression((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "underline" : "none"); ) a (text-decoration:underline ;)
В зависимост от йерархията на свойствата на CSS, нещо може да не работи в определен браузър. Плюс това, не бих използвал подчертаване, когато по подразбиране всички връзки вече са подчертани (или не са подчертани).
Алтернативен и кросбраузерен начин е да се опитате да отделите външните връзки от останалите чрез техните адреси. Да приемем, че външните връзки винаги са посочени като абсолютен(започващи с префикса http://), а вътрешните се пишат като роднина. Най-често това правят в нормалните сайтове. Това работи и в IE, поне от версия 8.
A ( тегло на шрифта: удебелен /* удебелен за абсолютни връзки */ )
Но тук се отклонихме от първоначалната задача и просто изискваме URL адресът да започва с http://, тоест подчертаваме с удебелен шрифт абсолютните URL адреси, които не са непременно външни, а не всички връзки, които се отварят в нов прозорец.
Като оставим настрана IE 6 и 7, можете да опростите нещата, като използвате псевдоелементите преди и след, които ви позволяват да посочите какво трябва да се появи преди или след елементите, към които са добавени.
Например, чрез стила можем да добавим малка картинка след всеки линк, който се отваря в нов прозорец.
Струва ми се обаче, че е по-логично просто промяна на дизайна на фонавръзка, която се отваря в нов прозорец - в края на краищата добавянето на текст или изображение преди или след връзката може да наруши оформлението на сайта. За да не страдаме, ще зададем жълтеникав фон на всички връзки, които се отварят в нов прозорец.
A ( цвят на фона: #FFFF99; ) a ( цвят на фона: израз ((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "#FFFF99" : "прозрачен ");)
Статията посочва основните принципи за използване на атрибута target="_blank" и също така предлага алтернатива на използването на този атрибут, при която кодът ще остане валиден.
Доста често срещана практика е, когато щракнете върху връзка ви отведе до целевата страница в нов раздел на браузъра. Тази техника се използва много често при посочване на разработчика на уеб ресурс или отговор на заявка в търсачка. Тази техника се постига чрез използването на атрибута target на тага. По-долу е примерен код:
HTML
< a href= "#" target= "_blank" >
В сегашното разбиране за модерно компетентно оформление и взаимодействие на потребителя с функционалността на ресурса е общоприето, че посетителят трябва сам да определи как точно ще следва връзката. Същото мнение се поддържа от опитни и известни уеб разработчици. Освен това използването на този атрибут нарушава работата на бутона „Назад“ на браузъра - това също се счита за отрицателен ефект на атрибута. Изброените фактори могат да предизвикат възмущение у посетителя на сайта.
Някои обясняват използването на целевия атрибут с факта, че когато го използвате, дори ако потребителят намери това, което търси на друг ресурс (към който е изпратена връзката), след затваряне на новоотворения раздел, той ще се върне към предишен сайт. Предполага се, че това увеличава вероятността за превръщане на случаен посетител в редовен потребител. Това твърдение е грешно! Можете да спечелите постоянното внимание на потребителя само с интересно и висококачествено съдържание. Напразно информацията се смята за един от най-ценните ресурси.
Освен това, според спецификацията на XHTML 1.0 Strict, използването на атрибута target е незаконно. В противен случай кодът няма да се счита за валиден. И самият валидатор ще покаже следното съобщение:
Както бе споменато по-рано, използването на атрибута target за следване на връзка в нов прозорец на браузъра не е в рамките на спецификациите и не се счита за валидно решение на проблема. Това обаче не е единственият начин за решаване на проблема. Подобен ефект може да се получи с помощта на js код.
Принципът на организиране на такъв процес се основава на събитието onclick. В стойността на това събитие ще бъде записана функция за отваряне на нов раздел на браузъра - window.open() , както и блокер, който ще отмени прехода към желания адрес в текущия прозорец - return false . В кода всички тези действия ще изглеждат така:
< a href= "#" onclick= "window.open(this.href); return false" >Връзка, която се отваря в нов раздел
За да проверите ефективността на предложения метод, можете да кликнете върху тази връзка, тя ще се отвори в нов прозорец.
След като се убедим в ефективността на метода, проверяваме валидността на кода. Валидаторът издава зелено съобщение, което показва, че нашият код е безупречен.
На пръв поглед постигнахме рационално решение на проблема, но при подробно тестване на метода се оказа, че ако браузърът има блокиране на изскачащи прозорци, методът ще спре да работи. Вместо да щракнете върху връзката, ще се появи съобщение за блокиране на изскачащи прозорци.
Модификация на js код за успешен преход при всякакви условияГореспоменатата функция е предназначена да освободи потребителя от излишната реклама в Интернет. Всички съвременни браузъри имат тази възможност в арсенала си и някои от тях могат да блокират на различни нива. Например, всички версии на Opera, започвайки от 9-та, имат възможност да блокират само маркирани прозорци или всички.
Въпреки че вероятно има много малко потребители, които инсталират блокери за изскачащи прозорци в своите браузъри, те все още съществуват. И трябва да вземем предвид всички възможни варианти за нормалното функциониране на сайта. Нека ви напомня, че ако има блок, връзката в нашия js код ще спре да работи.
Тогава какъв избор трябва да направите: или кодът не е валиден, или връзките не винаги работят? Нито един от двата варианта не ни устройва. Алтернативно решение дойде от тестването на връзка с атрибута target и активиран блокер на изскачащи прозорци. При зададените условия връзката се отвори, но само в собствен прозорец. Това означава, че трябва да модифицираме нашия js код, така че когато бъде блокиран, връзката да работи в текущия прозорец. Това се изпълнява по следния начин:
< a href= "#" onclick= "return !window.open(this.href)" >Връзка, която се отваря в нов раздел
Принципът на действие на метода остава практически непроменен, но формата на интерпретация на действията се променя. В новия код функцията window.open() се оценява на true, ако няма заключване, но ако е налице, функцията се оценява на false. Говорейки на руски, когато зададете съответните настройки в браузъра, връзката ще се отвори в текущата сесия, в противен случай - в нов раздел.
Проверка на модифицирано решение за връзка към основния блог.
заключенияВъз основа на информацията, представена по-горе, можем да заключим, че най-рационалният начин да принудите връзките да се отварят в нови раздели е да използвате последния метод, който се основава на JavaScript код.
В същото време обаче такива неща трябва да се използват внимателно, тъй като това налага определени действия на потребителя и ограничава свободата му на вземане на решения. Това се счита за лошо възпитание.
Изразът отваряне на връзки в нов прозорец в тази статия означава, че връзките ще се отварят в нов раздел или прозорец в зависимост от настройките на вашия браузър. Във всеки случай се предполага, че страницата, от която е щракнато върху връзката, ще остане отворена.
Защо това може да е необходимо? Посетителят в момента е на вашия сайт и има външна връзка в статията или на страницата на сайта. Ако тази връзка представлява интерес за посетителя по някакъв начин, тогава след щракване върху такава външна връзка той ще бъде отведен на друг сайт.
В друг сайт той може да отвори още няколко страници и след това ще му бъде трудно да стигне отново до вашия сайт. Той не е довършил четенето на вашата статия и не всеки потребител на компютър веднага ще разбере как да стигне отново до вашия сайт, защото хората имат различен опит и не винаги е ясно за начинаещите какво да правят в този случай.
В браузъра можете да щракнете върху бутона за връщане назад, но посетителят може дори да затвори прозореца на друг сайт, но иска да завърши вашата статия, а не статията, на която случайно е попаднал чрез външна връзка.
Можете да отворите връзка в нов раздел на браузъра, като ръчно вмъкнете атрибута „target“ със стойността на маркера „_blank“ във всяка такава връзка . В HTML ще изглежда така - цел=”_празно”. Но може да има много такива връзки и невинаги ще си спомняте кои външни връзки все още не са вмъкнали този атрибут.
При добавяне на нови линкове и изображения в статия, в административния панел на WordPress, в текстовия редактор има съответни елементи, чието активиране ви позволява да отворите добавените линкове и изображения в нов прозорец.
Има няколко начина да накарате връзките да се отварят в нов прозорец. В тази статия ще опиша само тези методи, които са работили на моя сайт.
Някои методи не работеха правилно на моя сайт в предишния шаблон, така че няма да говоря за тях. По-специално, главната страница беше показана неправилно в метод, който изисква включването на библиотеката на JavaScript - jQuery. Освен това този метод няма да работи, ако JavaScript е деактивиран.
Как да отворите връзка в нов прозорецЗа да отворите абсолютно всички връзки на сайта в нови прозорци или раздели, ще трябва да вмъкнете специален код във файла „Header (header.php)“.
За да вмъкнете този код, трябва да влезете в “WordPress Admin Panel” => “Appearance” => “Editor” => “Header (header.php)”.
Във файла „Header (header.php)“ между таговете и трябва да вмъкнете следния код точно преди затварящия таг:
Тази настройка за отваряне на страници в нов прозорец или раздел не ми се струва много удобна, защото това отваря много прозорци или раздели в браузъра. Но знам, че за някои, напротив, ще бъде удобно да могат да отварят външни и вътрешни връзки на сайта си по този начин.
Target Blank In Posts and Comments PluginПлъгинът Target Blank In Posts And Comments ви помага да отваряте връзки в коментари и публикации в нов прозорец, без да засяга други вътрешни връзки в сайта.
Можете да изтеглите приставката Target Blank In Posts And Comments от тук.
Този плъгин не е актуализиран от дълго време, но работи добре на най-новата версия на WordPress двигателя и върши работата си перфектно. Работеше и на моя сайт известно време.
За да инсталирате приставката Target Blank In Posts And Comments, ще трябва да влезете в „Admin Panel на WordPress“ => „Plugins“ => „Add New“ => „Install Plugins“ => „Upload“. След изтегляне, плъгинът трябва да се инсталира и активира.
Плъгинът Target Blank In Posts And Comments не изисква никакви настройки и започва да работи веднага след активирането му.
Използването на този плъгин ще ви позволи да върнете посетители на вашия сайт, които са кликнали върху външна връзка от вашия сайт. В края на краищата често се случва посетител да търси необходимата информация дълго време и след това внезапно да последва връзка, която го интересува от коментар или статия, след което да отиде някъде другаде и по този начин посетителят често не може да намери сайта, от който той първоначално дойде.
Плъгинът Target Blank In Posts And Comments върши добре работата си, като ви позволява да задържате и връщате посетители на вашия сайт.
Отваряне на връзка към коментар в нов прозорецАко трябва да отворите връзки с коментари без помощта на плъгин, това може да стане след промяна на съответния код. Ще трябва да се направят промени в кода на файла „comment-template.php“, който се намира в папката „wp-includes“.
За да направите това, ще трябва да се свържете с вашия сайт чрез FTP връзка с помощта на програми като FileZilla или Total Commander. Това може да стане и чрез файловия мениджър, който се намира в контролния панел на вашия хостинг.
Файлът “comment-template.php” се намира приблизително по този път - домейни/име на вашия сайт/public_htlm/wp-includes/comment-template.php.
внимание! Преди да промените файла „comment-template.php“, трябва да направите негово копие. В случай на проблеми, след промяна на кода на файла, вашият сайт може да спре да работи нормално. В този случай ще трябва да замените файла, който сте променили, със запазеното оригинално копие на този файл.
Подобен инцидент се случи и с мен и трябваше да върна сайта в работно състояние с помощта на техническата поддръжка на моя хостинг. Не запазих копие на оригиналния файл, направих грешни промени в кода на файла и след това сайтът ми спря да се показва в интернет за известно време.
Това нямаше да се случи, ако бях направил копие на файла преди да го променя, защото веднага щях да заменя счупения с работещ файл.
Ще трябва да копирате файла „comment-template.php“ на вашия компютър и да го запишете. Трябва да направите копие на записания файл и да направите промени в кода на файла, като го отворите с помощта на текстовия редактор на Notepad++. Можете да отворите файла в Notepad, но в Notepad ще бъде много трудно да намерите необходимите редове код, за да го промените.
След това трябва да добавите реда, започващ с $return = ”