మేము పాడైపోయిన బ్లాగ్ ప్రివ్యూలను ఇలా సరిచేశాము

నేను Xలో మా బ్లాగ్ లింక్‌ను పోస్ట్ చేశాను. ప్రివ్యూ ఇమేజ్ తప్పుగా కనిపిస్తోంది. సాంకేతిక వ్యాసానికి సంబంధించిన ఇమేజ్ బదులుగా, అది ఒక సేల్స్ బ్యానర్‌ను చూపించింది.

నేను మా చివరి ఏడు పోస్ట్‌లను తనిఖీ చేశాను. వాటన్నింటిలోనూ ఒకే సేల్స్ బ్యానర్ ఉంది. మా ఇంజనీరింగ్ డీప్-డైవ్స్ ప్రకటనలలాగా అనిపించాయి. ఇది మా విశ్వసనీయతను దెబ్బతీసింది.

సమస్య చాలా సరళమైనది. మా కోడ్‌లో ఒక ఫాల్‌బ్యాక్ రూల్ (fallback rule) ఉంది. ఒక పోస్ట్‌కు ఫీచర్డ్ ఇమేజ్ లేకపోతే, అది డిఫాల్ట్ సేల్స్ బ్యానర్‌ను ఉపయోగిస్తుంది. మా 42 పోస్ట్‌లకు మేము ఫీచర్డ్ ఇమేజ్‌లను సెట్ చేయనందున, ప్రతి పోస్ట్ ఒకే ఇమేజ్‌ను ఉపయోగించింది.

మాకు రెండు ఎంపికలు ఉన్నాయి:

  • ఆప్షన్ A: మాన్యువల్‌గా 42 ఇమేజ్‌లను సృష్టించడం. దీనికి సమయం పడుతుంది మరియు ప్రతి కొత్త పోస్ట్ కోసం మరింత పనిని సృష్టిస్తుంది.
  • ఆప్షన్ B: డైనమిక్ ఇమేజ్ జనరేటర్‌ను నిర్మించడం. ఇది ప్రతి పోస్ట్ కోసం ఆటోమేటిక్‌గా ఒక కస్టమ్ ఇమేజ్‌ను సృష్టిస్తుంది.

మేము ఆప్షన్ Bని ఎంచుకున్నాము. మేము PHP GD ఉపయోగించి ఒక చిన్న ఇంజిన్‌ను నిర్మించాము.

అది ఎలా పనిచేస్తుందంటే:

  • ఈ ఇంజిన్ అవసరానికి అనుగుణంగా 1200x630 PNGని సృష్టిస్తుంది.
  • ఇది డార్క్ బ్యాక్‌గ్రౌండ్ మరియు పోస్ట్ టైటిల్‌ను ఉపయోగిస్తుంది.
  • ఇది డేటాబేస్ నుండి టైటిల్‌ను తీసుకుంటుంది.
  • మొదటిసారి రెండర్ చేసిన తర్వాత ఇది ఇమేజ్‌ను డిస్క్‌లో సేవ్ చేస్తుంది.
  • ప్రతి భవిష్యత్తు రిక్వెస్ట్‌కు క్యాష్ చేయబడిన ఫైల్‌నే అందిస్తుంది. దీనివల్ల ఇది చాలా వేగంగా పనిచేస్తుంది.

ఈ నిర్మాణ సమయంలో మేము రెండు నిర్దిష్ట సమస్యలను పరిష్కరించాము:

  1. లాంగ్వేజ్ సపోర్ట్: Inter వంటి లాటిన్ ఫాంట్‌లను మాత్రమే ఉపయోగించడం వల్ల జపనీస్ టెక్స్ట్ ఖాళీ బాక్సులలాగా కనిపిస్తోంది. జపనీస్ టైటిల్స్ కోసం Noto Sans JPని మార్చడానికి మేము ఒక చెక్‌ను జోడించాము.

  2. విజువల్ టోన్: Vercel లేదా PlanetScale వంటి ప్రొఫెషనల్ టెక్ బ్లాగ్‌లు క్లీన్, డార్క్ కార్డ్‌లను ఉపయోగిస్తాయి. మా పాఠకుల నమ్మకాన్ని పొందడానికి మేము కూడా అదే శైలిని అనుసరించాము.

మీ కోసం ముఖ్యమైన పాఠాలు:

  • మీ సోషల్ మీడియా ప్రివ్యూలను ఆడిట్ చేయండి. మీ og:image ట్యాగ్‌లు పనిచేస్తున్నాయో లేదో తనిఖీ చేయడానికి ఒక టూల్‌ను ఉపయోగించండి.
  • ప్రతి పోస్ట్ కోసం మాన్యువల్ ఆర్ట్‌వర్క్‌ను నివారించండి. ఇది పెద్ద ఎత్తున నిర్వహించడం సాధ్యం కాదు.
  • ఒక సింపుల్ స్టాక్‌ను ఉపయోగించండి. PHP GD మరియు డిస్క్ క్యాష్ తేలికైనవి మరియు ప్రభావవంతమైనవి.
  • బహుళ భాషల కోసం ప్లాన్ చేయండి. ఎల్లప్పుడూ మీ పూర్తి క్యారెక్టర్ సెట్‌ను సపోర్ట్ చేసే ఫాంట్‌ను చేర్చండి.

మీ బ్లాగ్ ఇమేజ్‌లు మీ బ్రాండ్‌ను ప్రతిబింబిస్తాయి. ఒక డిఫాల్ట్ ఫాల్‌బ్యాక్ మీ మొదటి ఇంప్రెషన్‌ను దెబ్బతీయనివ్వకండి.

మూలం: https://dev.to/susumun/implementing-a-dynamic-ogp-image-generator-for-our-blog-php-gd-per-post-1200-630-cards-46al