11 användbara kodavsnitt för WordPress för nybörjare (expertval)

För personer som precis börjat med WordPress kan inlärning av kodavsnitt öppna upp en helt ny värld av möjligheter, vilket hjälper dig att skräddarsy din webbplats efter dina specifika behov.

När vi utvecklade vår egen webbplats har vi ofta använt kodsnuttar för anpassning inom vårt adminpanel och frontend-visning.

Med den här guiden är vårt mål att göra dessa kraftfulla verktyg tillgängliga för nybörjare genom att noggrant välja ut och förklara användbara WordPress-kodavsnitt som du kan börja använda direkt.

Vi har grundligt testat dessa avsnitt på verkliga webbplatser för att säkerställa att de fungerar som avsett och inte ger några fel.

I den här artikeln kommer vi att dela vår lista över de mest användbara WordPress-kodavsnitten för nybörjare.

Varför lägga till kodavsnitt i WordPress?

Om du har en WordPress-webbplats kan det hjälpa dig att låsa upp obegränsad anpassning och få din webbplats att sticka ut genom att lägga till några användbara kodsnuttar i dina temafiler eller ett plugin för kodsnuttar.

Du kan använda anpassad kod för att skräddarsy vissa specifika element på din webbplats. Du kan till exempel ändra textmarkeringsfärgen i WordPress genom att lägga till ett enkelt CSS-kodavsnitt.

Som nybörjare kan det att lägga till några användbara kodavsnitt också förbättra prestandan och hastigheten på din webbplats genom att minska behovet av flera plugins.

Förutom det kan kodavsnitt hjälpa dig att utöka dina kodningsfärdigheter och få tillgång till det stora biblioteket av kodavsnitt som WordPress-communityt delar gratis.

Med det sagt, låt oss titta på några av de mest användbara WordPress-kodavsnitten för nybörjare. Du kan använda snabblänkarna nedan för att hoppa till olika delar av vår handledning:

• Tillåt uppladdning av SVG-filer
• Inaktivera WP Admin-fältet
• Ta bort WordPress versionsnummer
• Lägg till utvalda bilder i RSS-flöden
• Inaktivera e-postmeddelanden om automatiska uppdateringar
• Ändra 'Howdy, Admin' i Admin-fältet
• Inaktivera XML-RPC
• Inaktivera automatisk tömning av papperskorgen
• Ändra utdragslängder
• Inaktivera e-postverifiering för webbplatsadministratör
• Inaktivera automatiska uppdateringar
• Hur man lägger till kodavsnitt i WordPress (enkel metod)
• Vanliga frågor om WordPress kodavsnitt

1. Tillåt uppladdning av SVG-filer

SVG (Scalable Vector Graphics) är ett filformat som definierar vektorgrafik med hjälp av XML-märkspråket. Detta format gör att du kan förstora bilder utan kvalitetsförlust.

Dessa filer är mindre och lättare än JPEG eller PNG, vilket hjälper dig att öka din webbplats hastighet.

WordPress tillåter dock inte SVG-filuppladdningar som standard eftersom SVG kan innehålla skadlig kod som komprometterar webbplatsens säkerhet.

Med det i åtanke, om du fortfarande vill ladda upp SVG-filer på din webbplats, kan du lägga till följande kodavsnitt på din webbplats:

/**
 * Allow SVG uploads for administrator users.
 *
 * @param array $upload_mimes Allowed mime types.
 *
 * @return mixed
 */
add_filter(
	'upload_mimes',
	function ( $upload_mimes ) {
		// By default, only administrator users are allowed to add SVGs.
		// To enable more user types edit or comment the lines below but beware of
		// the security risks if you allow any user to upload SVG files.
		if ( ! current_user_can( 'administrator' ) ) {
			return $upload_mimes;
		}

		$upload_mimes['svg']  = 'image/svg+xml';
		$upload_mimes['svgz'] = 'image/svg+xml';

		return $upload_mimes;
	}
);

/**
 * Add SVG files mime check.
 *
 * @param array        $wp_check_filetype_and_ext Values for the extension, mime type, and corrected filename.
 * @param string       $file Full path to the file.
 * @param string       $filename The name of the file (may differ from $file due to $file being in a tmp directory).
 * @param string[]     $mimes Array of mime types keyed by their file extension regex.
 * @param string|false $real_mime The actual mime type or false if the type cannot be determined.
 */
add_filter(
	'wp_check_filetype_and_ext',
	function ( $wp_check_filetype_and_ext, $file, $filename, $mimes, $real_mime ) {

		if ( ! $wp_check_filetype_and_ext['type'] ) {

			$check_filetype  = wp_check_filetype( $filename, $mimes );
			$ext             = $check_filetype['ext'];
			$type            = $check_filetype['type'];
			$proper_filename = $filename;

			if ( $type && 0 === strpos( $type, 'image/' ) && 'svg' !== $ext ) {
				$ext  = false;
				$type = false;
			}

			$wp_check_filetype_and_ext = compact( 'ext', 'type', 'proper_filename' );
		}

		return $wp_check_filetype_and_ext;

	},
	10,
	5
);

Du kan lägga till denna kod i ditt temas functions.php-fil eller använda ett plugin för kodavsnitt som WPCode. Senare i den här artikeln kommer vi att visa dig exakt hur du gör detta.

För mer detaljerade instruktioner kan du se vår handledning om hur du lägger till SVG-bildfiler i WordPress.

2. Inaktivera WP Admin-fältet

Som standard visar WordPress en admin-fält högst upp på din webbplats för alla inloggade användare, inklusive prenumeranter, författare, redaktörer och alla andra användarroller.

Denna adminpanel kan leda dem till din WordPress-instrumentpanel, där de kan göra ändringar på din webbplats beroende på deras användarbehörigheter.

Det kan dock vara lite distraherande när du tittar på frontend på din webbplats eftersom det ibland kan överlappa med designelement som sidhuvudet.

För att inaktivera WP-adminfältet, lägg helt enkelt till följande PHP-kodsnutt på din WordPress-webbplats:

/* Disable WordPress Admin Bar for all users */
add_filter( 'show_admin_bar', '__return_false' );

Efter kodkörning kommer adminfältet inte att visas på webbplatsens frontend.

Om du dock vill att adminfältet ska tas bort för alla utom administratören, kan du se vår handledning om hur man inaktiverar WordPress adminfältet för alla användare utom administratörer.

3. Ta bort WordPress versionsnummer

WordPress visar det aktuella WordPress-versionsnumret på din webbplats för spårning.

Ibland kan dock detta fotavtryck orsaka säkerhetsläckor genom att berätta för hackare om den WordPress-version som används. Hackare kan sedan rikta in sig på kända sårbarheter i specifika versioner.

För att ta bort versionsnumret, lägg till följande kodavsnitt på din webbplats:

add_filter('the_generator', '__return_empty_string');

När du har gjort det kommer hackare inte att kunna gissa din WordPress-version med automatiska skannrar och andra mindre sofistikerade försök.

För mer detaljerade instruktioner kan du se vår handledning om det rätta sättet att ta bort WordPress versionsnummer.

4. Lägg till utvalda bilder i RSS-flöden

RSS-flöden tillåter användare att få regelbundna uppdateringar om din WordPress-blogg med en flödesläsare som Feedly.

Detta kan hjälpa till att marknadsföra ditt innehåll och driva mer trafik till din webbplats. Genom att lägga till utvalda bilder eller miniatyrer bredvid inläggen i RSS-flödena kan du göra flödet visuellt tilltalande och ytterligare förbättra användarupplevelsen.

Du kan enkelt visa miniatyrbilder i dina RSS-flöden genom att lägga till följande användbara WordPress-kodavsnitt:

/**
 * Add the post thumbnail, if available, before the content in feeds.
 *
 * @param string $content The post content.
 *
 * @return string
 */
function wpcode_snippet_rss_post_thumbnail( $content ) {
	global $post;
	if ( has_post_thumbnail( $post->ID ) ) {
		$content = '<p>' . get_the_post_thumbnail( $post->ID ) . '</p>' . $content;
	}

	return $content;
}

add_filter( 'the_excerpt_rss', 'wpcode_snippet_rss_post_thumbnail' );
add_filter( 'the_content_feed', 'wpcode_snippet_rss_post_thumbnail' );

Detta kan göra ditt flöde mer engagerande och locka tillbaka besökare till din webbplats.

För mer detaljerad information, se vår handledning om hur du lägger till miniatyrbilder i dina WordPress RSS-flöden.

5. Inaktivera e-postmeddelanden om automatiska uppdateringar

Som standard skickar WordPress dig ett e-postmeddelande varje gång det automatiskt uppdaterar några plugins, teman eller själva kärnan.

Detta kan bli väldigt irriterande om du har flera WordPress-webbplatser och ständigt ser dessa meddelanden när du öppnar din e-post.

I så fall kan du enkelt inaktivera automatiska uppdateringsmeddelanden genom att lägga till följande PHP-kodavsnitt på din webbplats:

// Disable auto-update emails.
add_filter( 'auto_core_update_send_email', '__return_false' );

// Disable auto-update emails for plugins.
add_filter( 'auto_plugin_update_send_email', '__return_false' );

// Disable auto-update emails for themes.
add_filter( 'auto_theme_update_send_email', '__return_false' );

När du har gjort det får du inga aviseringar om automatiska uppdateringar av tillägg eller teman.

För detaljerade instruktioner, se vår steg-för-steg-handledning om hur man inaktiverar automatiska e-postmeddelanden om uppdateringar i WordPress.

6. Ändra 'Howdy, Admin' i adminfältet

När du loggar in på din WordPress-instrumentpanel möts du av ett 'Hej' följt av ditt visningsnamn längst upp till höger på skärmen.

Denna hälsning kanske inte låter naturlig för dig eller ser föråldrad ut, eller till och med lite irriterande.

Du kan enkelt ändra hälsningen i adminfältet genom att lägga till följande kodavsnitt på din WordPress-webbplats:

function wpcode_snippet_replace_howdy( $wp_admin_bar ) {

	// Edit the line below to set what you want the admin bar to display intead of "Howdy,".
	$new_howdy = 'Welcome,';

	$my_account = $wp_admin_bar->get_node( 'my-account' );
	$wp_admin_bar->add_node(
		array(
			'id'    => 'my-account',
			'title' => str_replace( 'Howdy,', $new_howdy, $my_account->title ),
		)
	);
}

add_filter( 'admin_bar_menu', 'wpcode_snippet_replace_howdy', 25 );

När du har lagt till koden måste du också lägga till en hälsning som du gillar bredvid raden $new_howdy = i koden.

För mer information kan du se vår handledning om hur man ändrar eller tar bort 'Howdy Admin' i WordPress.

7. Inaktivera XML-RPC

XML-RPC är ett kärn-WordPress API. Det gör det möjligt för användare att ansluta till sina webbplatser med tredjepartstjänster.

Till exempel behöver du aktivera XML-RPC om du vill använda ett automatiseringsverktyg som Uncanny Automator eller en mobilapp för att hantera din webbplats.

Men om du inte vill använda någon av dessa funktioner rekommenderar vi att du inaktiverar XML-RPC för att förhindra att hackare får åtkomst till din webbplats.

Hackare kan använda dessa sårbarheter för att hitta dina inloggningsuppgifter eller starta DDoS-attacker.

För att inaktivera XML-RPC kan du använda följande kodavsnitt på din webbplats:

add_filter( 'xmlrpc_enabled', '__return_false' );

Om du behöver mer information kan du se vår handledning om hur du inaktiverar XML-RPC i WordPress.

8. Inaktivera automatisk tömning av papperskorgen

WordPress tar bort allt som har legat i papperskorgen i mer än 30 dagar, inklusive inlägg, sidor och mediefiler.

Vissa användare kanske dock inte vill tömma sin papperskorg automatiskt så att de kan återställa borttagna filer när som helst.

I så fall kan du lägga till följande kodavsnitt på din WordPress-webbplats:

add_action( 'init', function() {
    remove_action( 'wp_scheduled_delete', 'wp_scheduled_delete' );
} );

När du har lagt till den här koden måste du nu manuellt tömma papperskorgen. För mer information kan du se vår handledning om hur du begränsar eller inaktiverar automatisk tömning av papperskorgen i WordPress.

9. Ändra utdragslängd

Utdrag är de första raderna i dina blogginlägg som visas under inläggsrubrikerna på din WordPress-hem-, blogg- eller arkivsida.

Du kanske vill förkorta ditt utdrag för att skapa nyfikenhet bland användarna och uppmuntra dem att klicka på inlägget för att få reda på mer.

På samma sätt kan du öka längden för att ge mer kontext och viktig information till läsarna utan att behöva klicka på inlägget.

För att ändra utdragslängden, lägg bara till följande kodavsnitt på din webbplats:

add_filter(
	'excerpt_length',
	function ( $length ) {
		// Number of words to display in the excerpt.
		return 40;
	},
	500
);

Som standard kommer detta kodavsnitt att begränsa utdraget till 40 ord, men du kan justera antalet på rad 5 till vad som fungerar bäst för din blogg.

För mer information, se vår nybörjarguide om hur man anpassar WordPress-utdrag.

10. Inaktivera e-postverifiering för webbplatsadministratören

Som standard skickar WordPress ett administrativt verifierings-e-postmeddelande till webbplatsadministratörer varannan månad för att verifiera om e-postadressen de använder fortfarande är korrekt.

Ibland kan detta meddelande dock skickas till dig oftare än nödvändigt, vilket kan vara irriterande.

Lyckligtvis kan du inaktivera e-postverifieringsmeddelandet för administratören genom att lägga till följande kodavsnitt på din WordPress-webbplats:

add_filter( 'admin_email_check_interval', '__return_false' );

För detaljerade instruktioner, se vår handledning om hur man inaktiverar WordPress admin e-postverifieringsmeddelande.

11. Inaktivera automatiska uppdateringar

WordPress uppdaterar automatiskt sin kärnprogramvara, plugins eller teman för att minska säkerhetshot, skadlig kod, intrång på webbplatsen och datastöld.

Automatiska uppdateringar kan dock ibland introducera kompatibilitetsproblem eller orsaka att din webbplats går sönder i sällsynta situationer.

I så fall kan du använda följande kodavsnitt för att inaktivera automatiska uppdateringar:

// Disable core auto-updates
add_filter( 'auto_update_core', '__return_false' );
// Disable auto-updates for plugins.
add_filter( 'auto_update_plugin', '__return_false' );
// Disable auto-updates for themes.
add_filter( 'auto_update_theme', '__return_false' );

Detta kommer att inaktivera alla automatiska uppdateringar av WordPress för kärnprogramvara, teman och plugins. För detaljerad information, se vår handledning om hur man inaktiverar automatiska uppdateringar i WordPress.

Hur man lägger till kodavsnitt i WordPress (enkel metod)

Nu när du känner till de mest användbara kodsnuttarna för WordPress för nybörjare kan du enkelt lägga till dem i ditt temas stilmallar eller functions.php-fil.

Kom dock ihåg att det minsta felet när du skriver koden kan bryta din webbplats och göra den otillgänglig. Dessutom, om du byter till ett annat tema, kommer all din anpassade kod att gå förlorad och du måste lägga till den igen.

Det är därför vi alltid rekommenderar att använda WPCode.

Vi använder WPCode för att utöka funktionaliteten på våra WordPress-webbplatser, och vi har funnit att det gör det superenkelt att säkert lägga till anpassad kod på din webbplats.

Dessutom kommer pluginet med ett bibliotek med över 900 kodavsnitt, inklusive alla de som vi har nämnt ovan. För mer information, se vår kompletta WPCode-recension.

Först måste du installera och aktivera WPCode-pluginet. För detaljerade instruktioner, se vår handledning om hur man installerar ett WordPress-plugin.

När du har aktiverat, besök sidan Kodavsnitt » + Lägg till avsnitt från WordPress-instrumentpanelen.

Detta tar dig till kodsnuttbiblioteket, där du kan lägga till anpassad kod på din webbplats genom att klicka på knappen ‘Använd kodsnutt’ under alternativet ‘Lägg till din anpassade kod (ny kodsnutt)’.

Om du däremot vill använda ett färdigt kodavsnitt kan du helt enkelt klicka på knappen 'Använd avsnitt' under det alternativet.

Om du lägger till ett anpassat kodavsnitt behöver du bara klistra in det i rutan 'Kodförhandsgranskning'.

Rulla sedan ner till avsnittet 'Infogning' och välj läget 'Automatisk infogning'. Koden kommer automatiskt att köras på din webbplats när kodavsnittet aktiveras.

Besök slutligen överst på sidan och växla den inaktiva omkopplaren till aktiv. Klicka sedan bara på knappen 'Uppdatera' för att spara dina inställningar.

Du har nu framgångsrikt lagt till kodavsnittet på din WordPress-webbplats.

För mer detaljerade instruktioner, se vår nybörjarguide om hur du enkelt lägger till anpassad kod i WordPress.

Vanliga frågor om WordPress kodavsnitt

Här är en lista över några frågor som ofta ställs av våra läsare om att använda anpassad kod och kodavsnitt i WordPress.

Hur visar jag kod på min WordPress-webbplats?

Om du skriver blogginlägg om tekniska ämnen, kan det vara användbart att lägga till kodavsnitt i dina inlägg. För att göra detta måste du öppna sidan/inlägget där du vill visa kodavsnittet och klicka på knappen för att lägga till block '+'.

När du har gjort det, infoga bara kodblocket från blockmenyn och lägg sedan till din anpassade kod i själva blocket.

Klicka slutligen på knappen 'Publicera' eller 'Uppdatera' högst upp för att spara dina ändringar.

Kodavsnittet kommer nu att visas på din WordPress-webbplats. För detaljerade instruktioner, se vår handledning om hur man enkelt visar kod på din WordPress-webbplats.

Hur skapar jag en WordPress-webbplats från grunden utan kodning?

Om du vill skapa en webbplats från grunden utan att använda någon kod, kan du använda SeedProd.

Det är den bästa WordPress-sidbyggaren på marknaden som låter dig skapa anpassade teman och landningssidor utan någon kodning.

Vi har själva använt det för att bygga hela webbplatser, och vi har haft fantastiska erfarenheter av det. För att få veta mer, se vår SeedProd-recension.

Pluginet levereras med över 300 färdiga mallar, en dra-och-släpp-byggare och många avancerade block som gör att du kan bygga en attraktiv webbplats med bara några få klick.

För detaljer kan du se vår handledning om hur man skapar en landningssida i WordPress.

Var kan jag få WordPress-kodavsnitt?

Du kan använda WPCodes bibliotek för att komma åt över 900 kodavsnitt som du enkelt kan lägga till på din webbplats.

Om du dock inte använder WPCode, kan du också få förskrivna kodavsnitt från webbplatser som Stack Overflow, CodePen eller GenerateWP.

Vi hoppas att den här artikeln hjälpte dig att hitta de mest användbara WordPress-kodsnuttarna för nybörjare. Du kanske också vill se vår handledning om hur man enkelt lägger till JavaScript i WordPress-sidor eller inlägg och våra toppval för bästa WordPress-temabyggare på marknaden.

Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.