Bilder och andra mediefiler är en viktig del av varje WordPress-webbplats. För att kunna använda dem effektivt, är det bra att ha koll på hur WordPress mediebibliotek fungerar.

Denna praktiska WordPress-funktion gör det möjligt för dig att lagra och hantera dina bilder och andra medier under längre tid. Med lite insiderkunskap och några enkla knep finns det mycket du kan göra för att förbättra din webbplats via ditt Mediabibliotek.

I den här omfattande guiden går vi igenom allt som finns att veta om WordPress mediebibliotek, inklusive hur du importerar och laddar ner innehåll. Vi kommer även att gå igenom bildredigering, långsiktig filhantering, och fyra hacks för att införliva avancerad funktionalitet.

Då kör vi igång!

En introduktion till WordPress mediebibliotek

I grund och botten, är WordPress mediebibliotek exakt vad dess namn antyder: en katalog över alla mediafiler som du har laddat upp till din webbplats:

WordPress mediebibliotek
WordPress mediebibliotek

WordPress är kapabelt att vara host för en mängd olika typer av media, inklusive:

Det inkluderas även vissa begränsade fotoredigeringsfunktioner, så att du kan göra justeringar efter behov direkt från instrumentpanelen.

WordPress stöder tyvärr ännu inte webp-bilder direkt vid installationen.

För att komma åt ditt mediebibliotek, kan du helt enkelt klicka på Media i ditt admin-sidofält när som helst:

Åtkomst till WordPress mediebibliotek
Åtkomst till WordPress mediebibliotek

Här finns det några grundläggande alternativ.

Först kan du avgöra om du vill se dina filer i en lista eller rutnätsvy genom att klicka på relevanta ikoner:

Alternativ för wordPress mediebibliotek
Alternativ för wordPress mediebibliotek

Du kan även filtrera filerna med hjälp av de nedrullningsbara menyerna:

Filtrera WordPress Media Library-filer
Filtrera WordPress Media Library-filer

Den första menyn gör det möjligt för dig att visa dina media efter typ, medan den andra filtrerar bibliotekets innehåll efter de datum då de laddades upp.

Du kan också använda sökfältet för att leta efter specifika filer efter namn:

Sökfältet i WordPress mediebibliotek
Sökfältet i WordPress mediebibliotek

Slutligen finns det även en knapp för massval. Med den här funktionen kan du ta bort flera filer från din WordPress-installation på samma gång:

Bulk select option in the WordPress Media Library
Bulk select option in the WordPress Media Library

Detta täcker all inbyggd funktionalitet i skärmen för WordPress mediebibliotek.

Som du kommer att se senare, kan du göra många ändringar för att förbättra det. Först måste vi dock diskutera hur man lägger till filer i WordPress.

Hur du lägger till filer i WordPress mediebibliotek

Det finns några olika sätt att lägga till filer (t.ex. din webbplats favicon) i WordPress mediebibliotek. Det första är att navigera till Media > Lägg till nya:

Åtkomst till WordPress Media-uppladdare
Åtkomst till WordPress Media-uppladdare

Här kan du ladda upp filer från datorn eller en annan enhet:

WordPress Media-uppladdare
WordPress Media-uppladdare

Du kan även lägga till media direkt från WordPress-redigeraren. I Blockredigeraren börjar du med att lägga till motsvarande block för den typ av media som du vill införliva:

WordPress-medieblock
WordPress-medieblock

I den resulterande platshållaren väljer du Ladda upp och väljer en fil från datorn:

Laddar upp media från Blockredigeraren
Laddar upp media från Blockredigeraren

Alternativt kan du helt enkelt dra och släppa filen från skrivbordet i det relevanta blocket.

I den klassiska redigeraren måste du klicka på knappen Lägg till media:

Knappen Lägg till media för Klassisk redigerare
Knappen Lägg till media för Klassisk redigerare

Sedan navigerar du till fliken Ladda upp och väljer en fil från datorn:

Laddar upp media från den klassiska redigeraren
Laddar upp media från den klassiska redigeraren

Du kan även dra och släppa filer från skrivbordet direkt i redigeraren när som helst.

I vissa fall kan du upptäcka att du måste ladda upp mediefiler manuellt till din WordPress-webbplats via FTP. Du kan göra detta med hjälp av en klient som FileZilla.

När du ansluter till din server, ska du navigera till wp-content > uppladdningar:

Ladda upp filer till katalogen i WordPress mediebibliotek via FileZilla
Ladda upp filer till katalogen i WordPress mediebibliotek via FileZilla

Ladda upp filer till den här katalogen för att lägga till dem i ditt mediebibliotek.

Hämta innehåll från WordPress mediebibliotek

I vissa fall kan du behöva hämta filer från ditt mediebibliotek på datorn. WordPress har en inbyggd funktion för detta. Navigera bara till Verktyg > Exportera:

Exportverktyget för WordPress
Exportverktyget för WordPress

Välj sedan alternativet Media. Om du endast behöver filer som har överförts inom en viss tidsram kan du använda rullgardinsmenyerna för att ange din begäran:

Exportera WordPress-media
Exportera WordPress-media

Klicka slutligen på knappen Ladda ner exportfil. Detta kommer att ladda ner de relevanta mediefilerna till din dator.

Så redigerar du bilder i WordPress mediebibliotek

Som vi nämnde tidigare har WordPress några inbyggda bildredigeringsfunktioner. För att komma åt dem navigerar du till ditt WordPress mediebibliotek och väljer den fil du vill redigera. Klicka sedan på knappen Redigera bild:

Knappen Redigera bild i WordPress
Knappen Redigera bild i WordPress

Detta kommer att öppna bildredigeraren:

WordPress bildredigerare
WordPress bildredigerare

Det finns fem grundläggande redigeringar som du kan göra:

Beskärning gör det möjligt för dig att klippa ut delar av bilden:

Bildbeskärning i WordPress
Bildbeskärning i WordPress

Rotera bilden kommer att vrida den antingen moturs eller medsols med 90 grader:

Rotera bilden åt vänster i WordPress
Rotera bilden åt vänster i WordPress

Om du vänder bilden kommer den att återspeglas antingen vertikalt eller horisontellt:

Vänd bild vågrätt i WordPress
Vänd bild vågrätt i WordPress

De andra tre inställningarna finns i sidofältet. Den första gör det möjligt för dig att ändra storleken på bilden genom att skala den. Ange helt enkelt din önskade höjd eller bredd, så kommer det andra fältet att fylla i automatiskt. Klicka sedan på knappen Skala:

Skalning av en bild i WordPress
Skalning av en bild i WordPress

Det är viktigt att notera att storleksändring av bilder i WordPress ibland kan påverka kvaliteten negativt.

Du kan dessutom endast ta stora bilder och skala ner dem. Du kan inte skala upp bilder till en större storlek!

Om du vill beskära din bild så att den har ett visst bildförhållande eller specifika dimensioner kan du använda fälten Proportioner och Markering under Bildbeskärning:

Ställa in dimensioner för bildbeskärningsval i WordPress
Ställa in dimensioner för bildbeskärningsval i WordPress

Slutligen, om du vill bevara den befintliga bildens miniatyrbild, kan du göra detta med hjälp av Miniatyrinställningarna. Välj bara alternativknappen för vilken version av din bild som du vill tillämpa ändringar på:

Miniatyrinställningar i WordPress bildredigerare
Miniatyrinställningar i WordPress bildredigerare

WordPress standard-bildredigering är användbar men begränsad. Den kan inte ersätta någon programvara som du kan använda för mer omfattande ändringar, särskilt om du driver en fotografi-webbplats eller foto-blogg.

Förstå vilka fel som kan uppstå i WordPress Mediebibliotek

Det uppstår ju tyvärr WordPress-fel då och då. Och WordPress mediebibliotek är inget undantag.

Ett problem som ofta dyker upp är ett ospecificerat ”HTTP-fel” som kan visas när du laddar upp en ny fil inifrån redigeraren:

HTTP-fel på medieuppladdning
HTTP-fel på medieuppladdning

Vanligtvis kan du helt enkelt vänta på att det här felet ska försvinna och prova din uppladdning igen efter några minuter. Om HTTP-felet återkommer kan det vara så att din WordPress-session har gått ut. Du måste logga in igen och göra ett nytt försök med din uppladdning.

Ett annat problem som vissa användare möter är att mediebiblioteket inte laddas. Detta beror ofta på en konflikt med dina plugins och / eller teman. Om du vill felsöka det här felet kan du prova att inaktivera alla dina plugins och byta till ett standardtema på WordPress.

Om mediebiblioteket laddas ordentligt igen måste du felsöka pluginkonflikten ytterligare för att kunna lösa problemet permanent.

Ibland kan du möta felet ”Uppladdning: Det gick inte att skriva fil till disk” när du börjar att ladda upp dina filer via mediebiblioteket. Vanligtvis uppstår det här problemet när uppladdningskatalogen inte är skrivbar. Du kan kontrollera dina filsystembehörigheter via WordPress webbplatshälsoverktyg.

Långsiktig hantering av mediebiblioteket

Hittills har vi fokuserat uteslutande på WordPress inbyggda funktionalitet när det gäller mediebiblioteket. Men när du använder den här funktionen över tiden kommer du troligtvis att stöta på en del problem som kräver hjälp från externa lösningar.

Ett exempel: ju fler filer du lägger till, desto mer oorganiserat blir ditt mediebibliotek. Bortsett från sök-och filteralternativen som vi nämnde i början av det här inlägget, erbjuder WordPress inte så mycket hjälp för att hantera oregerliga volymer av media.

Det finns dock några plugins som gör det möjligt för dig att ordna dina mediefiler i mappar.

Pluginet WordPress Media Library Folders är det mest populära alternativet:

WordPress Media Library Folders WordPress-plugin
WordPress Media Library Folders WordPress-plugin

Förutom att du kan skapa mediafilmappar, integrerar detta plugin även med MaxGalleria för att låta dig skapa bildgallerier direkt från Mediebiblioteket:

WordPress Gallery MaxGalleria WordPress-plugin
WordPress Gallery MaxGalleria WordPress-plugin

Uppgradering till WordPress Media Library Folders Pro ger ytterligare integrering med NextGEN Gallery-plugin och advanced Custom Fields. Det gör det även möjligt för dig att skapa kategorier och taggar för att ytterligare organisera dina filer.

En annan funktionalitet som WordPress saknar är möjligheten att ersätta mediefiler med nya versioner. Eftersom dessa typer av filer kan vara ganska stora, vill du inte fortsätta att lägga till nya närhelst du behöver uppdatera ditt innehåll.

Detta innebär att du måste leta upp den gamla versionen och ta bort den, efter att du har laddat upp en ny fil. Du kan spara lite tid genom att direkt ersätta gamla bilder med Enable Media Replace:

Enable Media replace WordPress-plugin
Enable Media replace WordPress-plugin

Med detta plugin kan du även ersätta alla länkar som riktas mot den gamla filen. Detta är till hjälp när du vill undvika trasiga medier på din webbplats.

Real Media Library är en annan hanterare för mappar och filer som det är bra att kolla in för att göra din filhantering enklare.

Real Media Library WordPress-plugin
Real Media Library WordPress-plugin

Tack vare detta plugin kan du ta hand om mängder av filer som bilder, videor och dokument direkt i WordPress. En trevlig sak att veta: Real Media Library finns på 12 språk. Om den kostnadsfria versionen inte räcker till dina behov, erbjuder de även en PRO-version med fler funktioner.

4 praktiska hacks för WordPress Mediebibliotek

WordPress mediebibliotek kan hantera de flesta av de vanliga kraven för en webbplatsadministratör. Men WordPress erbjuder ett antal funktioner och krokar som gör det möjligt för användare att förbättra specifika funktioner i Mediebiblioteket, utan användning av tredjeparts plugins. Låt oss djupdyka i dessa funktioner och krokar med fyra praktiska exempel.

1. Lägg till anpassad metadata till inläggstyper för bifogade filer

Varje gång du laddar upp en mediefil genererar WordPress en posttyp för bifogade filer.

Precis som för alla andra inläggstyper registreras bilagor i wp_posts-table och deras respektive metadata finns i wp_postmeta-table i din databas:

Standardpanel för detaljer, bifogade filer
Standardpanel för detaljer, bifogade filer

wp_posts-table lagrar data som innehåller post_content (beskrivning av bifogade filer), post_excerpt (bifogad fils bildtext), post_author, post_title, post_status och post_mime_type.

I wp_postmeta-table lagras alla slags metadata, exempelvis den bifogade fil-URL:en, bilddimensioner och mime types, och EXIF-metadata (Exchangeable Image File format) och IPTC (International Press Telecommunications Council).

Du kan ibland behöva lägga till anpassad metadata i bifogade filer, exempelvis namnet på författaren till ett dokument, en tillhörande URL eller platsen där ett foto togs. Att lägga till metafält till bilagor är lite annorlunda än att lägga till metafält till inlägg, och kräver specifika krokar och funktioner.

Först måste du lägga till alla nödvändiga anpassade fält på skärmen Redigera media. Du kan utföra den här uppgiften genom att filtrera de tillgängliga fälten via attachment_fields_to_edit i wp-admin/includes/media.php:

function media_hacks_field_to_edit( $form_fields, $post ){

	// https://codex.wordpress.org/Function_Reference/wp_get_metadata
	$media_author = get_post_meta( $post->ID, 'media_author', true );
    
	$form_fields['media_author'] = array(
		'value' => $media_author ? $media_author : '',
		'label' => __( 'Author' )
	); 
	return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_field_to_edit', 10, 2 );

Funktionen har två argument: $form_fields-matrisen med formulärfält och $post-objektet. Först hämtar get_post_meta det befintliga ’media_author’-värdet, sedan läggs ett ’media_author’-element till $form_fields-matrisen.

Slutligen returnerar callbacken $form_fields (se koden på Gist).

Då visas ett nytt fält på sidan Redigera media, som du kommer åt genom att välja relevant bild från ditt mediebibliotek och klicka på Detaljer för att redigera mer:

Få åtkomst till WordPress sida för att redigera media
Få åtkomst till WordPress sida för att redigera media

På den resulterande skärmen ser du ditt nya anpassade metadatafält längst ned:

Nytt "författare"-metadatafält
Nytt ”författare”-metadatafält

Nästa steg är att spara indata från användaren. Du kan åstadkomma detta genom att haka en ny funktion till edit_attachment action:

function media_hacks_edit_attachment( $id ){
	if ( isset( $_REQUEST['attachments'][$id]['media_author'] ) ) {
    
		$media_author = $_REQUEST['attachments'][$id]['media_author'];
    
		update_post_meta( $id, 'media_author', $media_author );
	}
}
add_action( 'edit_attachment', 'media_hacks_edit_attachment' );

Denna funktion har bara ett argument: $attachment_id för den aktuella mediefilen. Först kontrollerar funktionen om ett giltigt värde för det anpassade metafältet har skickats. Sedan registrerar den värdet tack vare update_post_meta (se koden på Gist).

Nu kan du hämta ’media_author’-värdet tack vare get_post_meta-funktionen:

$media_author = get_post_meta( $post->ID, 'media_author', true );

Därefter kan du visa den var som helst i frontend.

2. Visa EXIF och IPTC-metadata i skärmen Redigera media

I WordPress lagras utökad metadata för JPEG- och TIFF-mime types automatiskt. Nu när du vet hur du lägger till fält på skärmen Redigera media via media.php, kan du visa dessa data.

För att utföra denna uppgift måste du ändra den första callback-funktionen på följande sätt:

function media_hacks_fields_to_edit( $form_fields, $post ){

	// get post mime type
	$type = get_post_mime_type( $post->ID );

	// get the attachment path
	$path = get_attached_file( $post->ID );

	// get image metadata
	$metadata = wp_read_image_metadata( $path );

	if( 'image/jpeg' == $type ){

		if( $metadata ) {

			$exif_data = array(
				'aperture'          => 'Aperture', 
				'camera'            => 'Camera', 
				'created_timestamp' => 'Timestamp',
				'focal_length'      => 'Focal Length', 
				'iso'               => 'ISO', 
				'shutter_speed'     => 'Exposure Time', 
				'orientation'       => 'Orientation' );

			foreach ( $exif_data as $key => $value ) {

				$exif = $metadata[$key];
				$form_fields[$key] = array(
					'value' => $exif ? $exif : '',
					'label' => __( $value ),
					'input' => 'html',
					'html'  => "ID][$exif]' value='" . $exif . "' />
				);
			}
		}
	}
	return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_fields_to_edit', 10, 2 );

I det här kodavsnittet används följande WordPress-funktioner:

Om bildens mime type är ”bild/jpeg”, och om metadata finns, deklareras sedan en matris med obligatoriska metadata, och det skapas ett formulärfält för varje element i matrisen:

EXIF- och IPTC-metadatafält i wordPress detaljer för bifogade filer
EXIF- och IPTC-metadatafält i wordPress detaljer för bifogade filer

Formulärfälten i det här exemplet är lite mer komplexa, eftersom vi anger ett värde för formulärelementet ’html’ (se koden på Gist). Du behöver inte spara EXIF- och IPCT-metadata, eftersom WordPress automatiskt lagrar dem i wp-postmeta när du laddar upp bilder.

3. Visa Utökad Metadata på Frontend

Att ha all denna information för dig själv på backend är användbart. Men om du även vill visa utökad metadata för dina mediefiler på frontend, måste du trixa lite mer.

För att göra detta kan du lägga till denna information till bilagans beskrivning med hjälp av ett the_content-filter i wp-admin/includes/post.php:

function media_hacks_the_content( $content ){
	global $post;

	if( is_attachment() && 'image/jpeg' == get_post_mime_type( $post->ID ) ) {

		$fields = wp_get_attachment_metadata( $post->ID );
		$meta = $fields['image_meta'];

		if( ! empty( $meta['camera'] ) ){
			$custom_content = "
			<ul>
				<li>Camera: {$meta['camera']}</li>
				<li>Created timestamp: {$meta['created_timestamp']}</li>
				<li>Aperture: {$meta['aperture']}</li>
				<li>Focal length: {$meta['focal_length']}</li>
				<li>ISO: {$meta['iso']}</li>
				<li>Shutter speed: {$meta['shutter_speed']}</li>
				<li>Orientation: {$meta['orientation']}</li>
			</ul>";
			$content .= $custom_content; 
		}
	}
	return $content;
}
add_filter( 'the_content', 'media_hacks_the_content' );

Här anropas funktionen wp_get_attachment_metadata. Om den aktuella inläggstypen är ”attachement”, och om aktuell mime type är ”bild/jpeg”, hämtas sedan tillgänglig bildmetadata och används för att bygga en oordnad lista med fält, som bifogas till inläggsinnehållet.

Funktionen callback returnerar $content (se denna kod på Gist):

EXIF- och IPTC-metadata som visas på en bilagesida
EXIF- och IPTC-metadata som visas på en bilagesida

Ovan kan du se det nya bilage-inlägget med metadata som är bifogad till beskrivningen.

4. Publicera ett fotoarkiv

WordPress kan inte visa arkiv av bilagor utan lite trixande. Detta beror på att has_archive-alternativet för posttypen bifogad fil är inställd på false.

Medan standardparametern post_status för $query-objektet är inställd på ”publish”, är standardbilagan post_status inställd på ”inherit”. Det innebär att inga bilagor kommer att visas i arkiv om vi inte uttryckligen sätter post_status till ”inherit” eller ”any” (se WP_Query Type parameters för ytterligare information).  

För att visa bildarkiv, måste du definiera två funktioner. Den första funktionen filtrerar argumenten för en angiven posttyp, och ställer in egenskapen för has_archive till true:

function media_hacks_register_post_type_args( $args, $post_type ){
	if( $post_type == 'attachment' ){
		$args['has_archive'] = true;
	}
	return $args;
}
add_filter( 'register_post_type_args', 'media_hacks_register_post_type_args', 10, 2 );

Den andra funktionen ställer in anpassade värden för frågevariablerna post_mime_type och post_status:

function media_hacks_pre_get_posts( $query ){
	if ( !is_admin() && $query->is_main_query() ) {

		if( is_post_type_archive('attachment') ){
			$query->set('post_mime_type', 'image/jpeg');
			$query->set( 'post_status', 'inherit' );
		}
	}
}
add_action( 'pre_get_posts', 'media_hacks_pre_get_posts' );

Funktionen är ansluten till pre_get_posts åtgärdskrok, som avfyras efter att frågan har skapats, men innan den utförs. $query-objektet skickas efter referens, inte efter värde, vilket innebär att alla ändringar av den aktuella instansen av $query kommer att påverka det ursprungliga $query-objektet.

Av den anledningen är det viktigt att verifiera vilken fråga du ska ändra (se den här koden på Gist). Om du sedan anger https://yourdomain.com/?post_type=attachment i webbläsaren bör du se ett arkiv med JPEG-bilder:

WordPress mediearkiv
WordPress mediearkiv

Den fullständiga koden för alla dessa hacks finns som ett plugin i en offentlig Gist, som vi har hänvisat till i detta avsnitt. Du kan ladda ner den som en .zip-fil och ladda upp den till din WordPress-webbplats för att genomföra alla fyra av dessa hacks, utan att behöva redigera dina filer manuellt.

Sammanfattning

Bilder, videoklipp, ljudfiler och dokument kan vara extremt värdefulla för webbplatsens användare. WordPress mediebibliotek är väsentligt för att ladda upp, publicera och till och med ändra dessa filer för att tillgodose behoven hos ditt innehåll.

Har du några andra frågor om WordPress mediebibliotek? Låt oss veta i kommentarerna nedan!

Carlo Daniele Kinsta

Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.