Afbeeldingen & databasemodel (WordPress)

Uit De Vliegende Brigade
Naar navigatie springen Naar zoeken springen

Alle velden bij elkaar

Let op: Deze tabel betreft posts van het type afbeelding zoals gebruikt in WooCommerce-sites met buttonbars: Veel dingen werken anders voor afbeeldingen dan voor meer veelzijdige posts, zoals pagina's.

Database-tabel Database-(meta)-veld Naam SEO Opmerkingen
wp_posts ID Post-ID Niet van toepassing Gebruikelijke post-id. Dit is de meest algemene PK in een WordPress-database
wp_posts post_content
  • Post-content
  • Description
  • Beschrijving
 Lijkt niet te worden gebruikt Voor afbeeldingen bevat dit veld de beschrijving
wp_posts post_title Title Factor #3
  • Twee-na-belangrijkste veld qua SEO
  • Als je alleen de afbeelding opvraagt (dus zonder context): De titel zoals je die ziet bovenin de browser
  • Als de afbeelding embed is in een bepaalde content: Afhankelijk van de content of en hoe dit veld getoond wordt.
wp_posts post_excerpt Caption Lijkt niet te worden gebruikt Zie schermafdruk
wp_posts post_name
  • Name
  • (Slug - zie hiernaast)
  • (Aangepaste permalink - zie hiernaast)
Lijkt niet te worden gebruikt
  • WordPress noemt dit veld soms permalink en ik denk dat dat onterecht en verwarrend is
  • Voor afbeeldingen bestaat er geen slug en dus geen aangepaste permalink: Je hebt alleen permalink en file URL, en dit veld is enkel de post-name
wp_posts guid
  • Guid
  • Global Unique IDentifier
 Niet van toepassing
  • Relevant voor feed-readers maar verder gewoon negeren. Echt waar
  • Voor afbeeldingen bevat dit veld doorgaans het complete upload-pad, maar is niet betrouwbaar
wp_posts post_type Post-type Niet van toepassing Dit veld heeft voor afbeeldingen altijd de waarde attachment
wp_posts post_mime_type Mime-type Niet van toepassing Can be handy when searching for an object. In this case: image/jpeg
wp_meta _wp_attached_file File URL Factor #1
  • Verreweg het belangrijkste veld qua SEO
  • Je moet hier alleen baseurl/wp-content/uploads aan vooraf laten gaan
  • File URL is een ondubbelzinnige term: Het betreft namelijk het pad via de webserver/http en niet via het bestandssysteem van de webserver
  • Waarschijnlijk de primaire bron om de bestandsnaam te achterhalen: Je kunt 'm op andere manieren achterhalen, maar dit is hoogstwaarschijnlijk de enige juiste manier.
wp_meta _wp_attachment_metadata Attachment metadata Niet van toepassing Serialised field met een hoop informatie, waaronder omtrent image-presets. Ik geloof dat ik er zo snel (2022.07) geen informatie in zag, die ik nergens anders kon vinden
wp_meta _wp_attachment_image_alt Factor #2 Eén-na-belangrijkste veld qua SEO
-- -- Permalink Niet relevant
  • Permalinks worden niet opgeslagen voor individuele posts. Het is ook niet de bedoeling om deze aan te passen: Dan zouden het geen permanente links meer zijn
  • Als je de permalink van een post intikt in een browser, wordt je doorgestuurd naar de bijbehorende slug
  • Afbeeldingen kennen geen slug, maar wel een permalink. Als je de permalink opgeeft in een browser, wordt je doorgestuurd naar de file URL.
Media library » View: Velden:
  • post_content
  • post_name
  • post_title
Media library » Edit: Velden:
  • post_excerpt
  • post_content
  • wp_attachment_image_alt

Hoe het werkt

Als je een afbeelding upload, worden er direct records aangemaakt in tabellen wp_posts en wp_postmeta, ook als je de afbeelding verder nergens toepast (als bv. een WooCommerce-productafbeelding of WooCommerce-gallery-afbeelding):

  • Primair: Er wordt een post toegevoegd aan tabel wp_posts van het type attachment en in dit geval subtype image/jpeg
  • Secundair: Voor allerlei aanvullende gegevens worden zo'n 5 records aangemaakt in tabel wp_postmeta.

wp_posts

select
   *
from
   wp_posts
where
   post_type = "attachment";

wp_postmeta

select
   # wp_posts.*,
   wp_postmeta.*
from
   wp_posts
join
   wp_postmeta
   on
   wp_posts.ID = wp_postmeta.post_id
where
   wp_posts.post_type = "attachment";

Voorbeeld: Uploaden van een afbeelding

Databasemodel rondom een afbeelding (die verder nergens mee is geassociëerd) in volle glorie

Als voorbeeld heb ik een afbeelding riverbug.jpeg geüpload.

Om in één keer alle data te zien (dit geeft een Cartesiaans product, want 1 record in wp_posts en 5 records in wp_postmeta): 

select
   *
from
   wp_posts
join
   wp_postmeta
   on
   wp_posts.ID = wp_postmeta.post_id
where
   wp_posts.post_title 
   like 
   "River Bug%";

wp_posts

select * from wp_posts where post_type = "attachment" and post_title like "River Bug%";

De belangrijkste velden (denk ik, voor mij, op dit moment):

Veld Opmerkingen
ID Gebruikelijke post-id. Dit is de meest algemene PK in een WordPress-database
post_content Description - Beschrijving
post_title Post-title - Ingewikkelder is het niet
post_excerpt Caption - Zie schermafdruk
post_name Slug. De afbeelding is op minimaal drie manieren te bereiken:
guid Global Unique IDentifier for feed-readers. Gewoon negeren. Echt waar
post_type attachment
post_mime_type Can be handy when searching for an object. In this case: image/jpeg
Media library » View: Velden post_content, post_name en post_title
Media library » Edit: Velden post_excerpt, post_content en wp_postmeta » _wp_attachment_image_alt

wp_postmeta

Nogmaals: Direct bij uploaden van een afbeelding, worden er al records aangemaakt in tabel wp_postmeta. Ik vermoed dat dit met backwards compatibility heeft te maken: Tegenwoordig zijn er meer velden relevant dan in de tijd dat dit onderdeel van WordPress was ontworpen. Die nieuwe velden zijn daarom ondergebracht in deze tabel.

Om de relevante zaken boven water te toveren: 

select
   wp_postmeta.*
from
   wp_posts
join
   wp_postmeta
   on
   wp_posts.ID = wp_postmeta.post_id
where
   wp_posts.post_title like "River Bug%";

of als je het post_id weet: 

select * from wp_postmeta where post_id = 59303;

Belangrijkste velden:

meta_key Opmerkingen
_wp_attached_file
  • Filepath van het bestand. Je moet hier alleen baseurl/wp-content/uploads aan vooraf laten gaan
  • Alternatief voor de slug
  • Waarschijnlijk de primaire bron om de bestandsnaam te achterhalen: Je kunt 'm op andere manieren achterhalen, maar dit is hoogstwaarschijnlijk de enige juiste manier
_wp_attachment_image_alt Alt-tekst
wp_postmeta: Alle records voor het geüploade bestand
wp_postmeta: Serialised content van _wp_attachment_metadata. God behoedde dat ik dit ooit moet gaan parsen

Voorbeeld: Bestandsnaam aanpassen

  • Bestandsnamen worden écht bijgehouden in tabel wp_postmeta met meta_key = _wp_attached_file
  • Wil je een andere afbeelding bij een product? Verander dan dit veld - dwz. laat het naar een andere bestand wijzen
Oude situatie: Bestand wordt niet gevonden
SQL-code
Nieuwe situatie: Bestand werd gelijk gevonden

Voorbeeld: Bestandsnamen achterhalen: 

select
   ID,
   post_title,
   post_name,
   meta_value
from
   wp_posts
join
   wp_postmeta
   on
   wp_posts.ID = wp_postmeta.post_id
where
   post_type = "attachment"
and
   post_mime_type like "image%"
and
   meta_key = "_wp_attached_file" # Not "_wp_attachment_metadata"!
order by
   ID;

Voorbeeld: Thumbnail (2019)

Dit voorbeeld komt uit een ander artikel. Het stamt vermoedelijk uit 2019:

Vantevoren

Testproduct (zonder afbeelding) met id = 1347
Afbeelding met met id = 1348
En voor de zekerheid ook nog een 'gewone' post, met id = 1349 - Posts kennen geen standaard-afbeelding
En voor de zekerheid ook nog een 'gewone' pagina, met id = 1351. Pagina's kennen wel een standaard-afbeelding, featured image (niet geconfigureerd)
Tabel wp_posts: Al deze objecten, plus twee revisies
Tabel wp_postmeta: Entries tav. product id = 1347: Weinig spannends
Tabel wp_postmeta: Entries tav. afbeelding id = 1348: Ook weinig spannends. Merk op dat veld _thumbnail niet voorkomt

Thumbnail toevoegen

De afbeelding wordt toegevoegd aan het product
De afbeelding staat er écht
in wp_postmeta is dit de enige verandering: Veld _thumbnail_id is toegevoegd. De waarde is de ID van de afbeelding - Zo simpel

Afbeeldingen & producten

WooCommerce-producten kennen twee soorten afbeeldingen: De primaire afbeelding, en gallerij-afbeeldingen.

Voorbeeld-code

Gebaseerd op Databasemodel (WordPress)#WooCommerce-producten - Uitgebreide variant en onder de aanname dat de gallery maar één additionele afbeelding bevat: 

################################################################################
# Select product data
################################################################################
#
select 
    wp_posts.id			as post_id,
    wp_posts.post_title		as post_title,
    wp_posts.post_content	as content,
    wp_postmeta.meta_value	as sku,
    wp_postmeta_03.meta_value	as thumbnail_path,
    wp_postmeta_05.meta_value	as second_image_path
from 
    wp_posts


# First join to wp_postmeta to retrieve sku
############################################################
#
left join
    wp_postmeta
    on
    wp_posts.id = wp_postmeta.post_id


# Second join to wp_postmeta to retrieve "_thumbnail_id"
############################################################
#
# "_thumbnail_id" on its turn, is a wp_postmeta.product_id
#
left join
    wp_postmeta as wp_postmeta_02
    on
    wp_postmeta_02.post_id = wp_posts.id
    and
    wp_postmeta_02.meta_key = "_thumbnail_id"


# Join 03 to wp_postmeta to retrieve thumbnail-path
############################################################
#
# This join is different from the two below, as it is a
# double join: It retrieves the meta_id for the thumbnail-
# attachment
#
left join
    wp_postmeta as wp_postmeta_03
    on
    wp_postmeta_03.post_id = wp_postmeta_02.meta_value
    and
    wp_postmeta_03.meta_key = "_wp_attached_file"


# Join 04 to wp_postmeta: "_product_image_gallery"
############################################################
#
# Retrieve the meta_value for "_product_image_gallery":
# It is the post_id of everything related to the second
# image
#
left join
    wp_postmeta as wp_postmeta_04
    on
    wp_postmeta_04.post_id = wp_posts.id
    and
    wp_postmeta_04.meta_key = "_product_image_gallery"


# Join 05 to wp_postmeta: "_product_image_gallery"
############################################################
#
# Retrieve the meta_value for "_product_image_gallery":
# It is the post_id of everything related to the second
# image
#
left join
    wp_postmeta as wp_postmeta_05
    on
    wp_postmeta_05.post_id = wp_postmeta_04.meta_value
    and
    wp_postmeta_05.meta_key = "_wp_attached_file"


# Where clause
############################################################
#    
where 
    post_type="product"
    and
    post_status="publish"
    and
    wp_postmeta.meta_key="_sku"


# Limit
############################################################
#
limit 
    0, 10;

Permalinks & slugs

  • Ik vermoed dat de structuur om permalinks te vormen wordt opgeslagen, maar dat de eigenlijke permalinks niet worden opgeslagen: Ze worden dynamisch aangemaakt wanneer ze nodig zijn.
  • Als je een permalink intikt van een post intikt in een browser, wordt je doorgestuurd naar de bijbehorende slug.
  • Voor afbeeldingen lijken er echter geen slugs te bestaan. Je kunt de permalinks dus ook niet aanpassen. Als je de permalink van een afbeelding in een browser opgeeft, wordt je doorgestuurd naar de bijbehorende file URL - Deze kun je standaard niet aanpassen via wp-admin.

De structuur voor permalinks, is opgeslagen in wp_options: 

select 
   * 
from 
   wp_options
where
   option_name like "perma%"

Uitkomst op een testsite: 

option_id   option_name           option_value   _autoload
28          permalink_structure   /%postname%/   yes

Dit is hetzelfde wat je ziet onder wp-admin » Settings » Permalinks

Bronnen:

Worden deze velden überhaupt gebruikt?

Worden deze velden überhaupt gebruikt op de site of voor SEO? Goede vraag! Je kunt afbeelding-attributen tot in de puntjes verzorgen, maar als ze niet gebruikt worden, boeit dat weinig. Laten we dit checken voor de gebruikelijke WooCommerce-sites waarmee ik werk, inclusief buttonbars

Bestandsnaam

Bestandsnamen worden geïndexeerd door Google, en je kunt ze op die manier terugvinden:

Voorbeeld:

  • Bestandsnaam: https://example.com/wp-content/uploads/2020/05/widget-blub-example.com-sku-ca-12-345-image-02.jpg
  • Als ik in Google zoek op widget-blub-example.com-sku-ca-12-345-image-02, vind ik 'm gelijk
  • Als ik in Google zoek op widget blub example.com sku ca-12-345 image 02, vind ik 'm gelijk
  • Als ik in Google zoek op widget blub example.com image 02, vind ik 'm niet. Ik krijg wel een hoop andere afbeeldingen van de site. Logisch dat het specifieke product niet wordt gevonden, want zonder SKU is deze beschrijving niet uniek

Productpagina

de sourcecode voor een afbeelding op een productpagina

Velden die je zoal terugvindt in deze broncode:

  • data-thumb - Custom attribute, waarschijnlijk niet relevant voor SEO [1]
  • data-thumb-alt - Custom attribute, waarschijnlijk niet relevant voor SEO [2]
  • img » alt
  • img » title
  • img » data-caption - Custom attribute, waarschijnlijk niet relevant voor SEO [3]
  • data-src - Custom attribute, waarschijnlijk niet relevant voor SEO [4]
  • data-large_image - Custom attribute, waarschijnlijk niet relevant voor SEO [5]
  • srcset - Links to this image in other formats

Conclusie: De volgende velden vind je terug op productpagina's (naast de vanzelfsprekende file url):

  • img » alt
  • img » title
  • srcset.

Buttonbar

Sourcecode voor een buttonbar

Een buttonbar toont de volgende velden (naast de vanzelfsprekende file URL):

  • img » alt
  • srcset

Shoppagina

Sourcecode voor de afbeelding in een productblok op een shoppagina

Velden die voor een afbeelding in een productblok op een shoppagina worden gebruikt:

  • img » alt
  • srcset.

Conclusies

De volgende velden worden gebruikt voor SEO, en je moet zelf voor passende inhoud zorgen (itt. tot srcset):

  • Bestandsnaam
  • img » alt
  • img » title.

Alt text

The alt text is stored in table wp_postmeta: 

select
   ID,
   post_title,
   post_name,
   meta_value,
from
   wp_posts
join
   wp_postmeta
   on
   wp_posts.ID = wp_postmeta.post_id
where
   post_type = "attachment"
and
   post_mime_type like "image%"
and
    meta_key = "_wp_attachment_image_alt"
order by
   ID;


Zie ook

Bronnen

Overgenomen van "https://wiki.devliegendebrigade.nl/index.php?title=Afbeeldingen_%26_databasemodel_(WordPress)&oldid=34773"