Ikona pro externí odkaz Wordpress či WooCommerce

WordPress (WP) je webový software pro správu obsahu (CMS) napsaný v PHP a spárovaný s databází MySQL nebo MariaDB. Mezi funkce patří architektura zásuvných modulů a systém šablon, které se označují jako Témata. CMS byl původně vytvořen jako systém pro publikování blogů, ale vyvinul se tak, aby podporoval další typy webového obsahu.

Včetně tradičnějších e-mailových seznamů a fór, mediálních galerií, členských stránek, systémů pro řízení výuky (LMS) a online obchodů. Jedno z nejpopulárnějších používaných řešení systému pro správu obsahu, používá jej k říjnu 2021 42,8 % z 10 milionů nejlepších webových stránek. Prvně byl vydán 27. května 2003 jeho zakladateli, americkým vývojářem Mattem Mullenwegem a anglickým vývojářem Mikem Littleem, jako fork b2/cafelog.

Software je vydán pod licencí GPLv2 (nebo novější). Aby zprávce obsahu fungoval, musí být nainstalován na webovém serveru, buď jako součást internetové hostingové služby, nebo na počítači se softwarovým balíčkem, aby mohl sloužit jako síťový hostitel sám o sobě. Místní počítač lze použít pro účely testování a učení pro jednoho uživatele.

WordPress funkce ikona externí odkaz

Funkce se přidáva do souboru function.php popsáno včetne child_theme v článku child_theme wordpress. Kód ikona externí odkaz ve WP a Woo.

function ace_add_external_link_icon(  ) {
	wp_register_script( 'external-link-icon', false );
	wp_enqueue_script( 'external-link-icon' );
	
	wp_add_inline_script( 'external-link-icon', "
		function externalLinkIcon() {
			var icon = '<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" role=\"img\" width=\"1em\" height=\"1em\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 20 20\">' +
				'<path d=\"M9 3h8v8l-2-1V6.92l-5.6 5.59l-1.41-1.41L14.08 5H10zm3 12v-3l2-2v7H3V6h8L9 8H5v7h7z\" fill=\"currentColor\"/>' +
				'</svg>';

			// Check if content is available
			if (!document.querySelector('.entry-content')) return;

			var links = document.querySelector('.entry-content').querySelectorAll('a');
			[...links].forEach(function (link) {
				if (link.host !== window.location.host) {
					link.innerHTML += ' ' + icon;
				}
			});
		}
		window.addEventListener('load', externalLinkIcon, false);
	" );
}
add_action( 'wp_enqueue_scripts', 'ace_add_external_link_icon' );

Po zapsání nové funkce do souboru functions.php soubor jednoduše uložíme a tím celá úprava konči.

Vizualizace značky

Značka ikony externího odkazu zobrazena na screenshotu

Užitečné

WP vlastní font Awesome.
Domovská stránka WP.