የዎርድፕረስ ፖስት ሰንጠረዦች ምላሽ አይሰጡም? የሲኤስኤስ ኮድ + ተሰኪ መፍትሄዎች

መላመድ የማይችልየዎርድፕረስሰንጠረዦች የሞባይል መዝለል መጠኖችን በቀጥታ በ37% እንዲጨምሩ ሊያደርግ ይችላል፣ እና በGoogle SGE እንደ ዝቅተኛ ጥራት ያለው ይዘት በቀጥታ ይለያሉ።

我做የዎርድፕረስ ድር ጣቢያባለፉት ዓመታት፣ በጣም ብዙ ጦማሪዎች እጅግ በጣም ጥሩ የሆኑ የንጽጽር ሰንጠረዦችን እና የፓራሜትር ሰንጠረዦችን በመፍጠር ሰዓታት ሲያሳልፉ አይቻለሁ፣ ነገር ግን በሞባይል መሳሪያዎች ላይ ሲታዩ ሙሉ በሙሉ የተዛቡ ሆነው አግኝቻቸዋለሁ።

ወይ ይዘቱ አንድ ላይ ተጨናንቆ በግልጽ ሊታይ አይችልም፣ ወይም ሰንጠረዦቹ የገጹን አቀማመጥ ይሰብራሉ፣ እና ተጠቃሚዎች ጥቂት ጊዜ አንሸራትተው ገጹን ይዘጋሉ።

ይበልጥ አሳሳቢ የሆነው ደግሞ፣ እንደ ፐርፕሌክሲቲ እና ጉግል ኤስጂኢ ያሉ ጀነሬቲቭ ሞተሮች አሁን ከሁሉም መሳሪያዎች ጋር ተኳሃኝ የሆነ የተዋቀረ ይዘትን ለመቃኘት ቅድሚያ ይሰጣሉ።

ጠረጴዛዎ ምንም እንኳን... እንኳን ተለዋዋጭ አይደለም።AIለጥቅሶች ወይም ለምክሮች እንኳን ብቁ አይደሉም።

አሁን በተደጋጋሚ ያረጋገጥኳቸውን ሁሉንም የመላመድ መፍትሄዎች፣ ዜሮ ተሰኪዎች እና ዜሮ የአፈጻጸም መጥፋት ወይም የWordPess ተሰኪዎች ላካፍላችሁ ነው።

እያንዳንዱ እርምጃ በቀጥታ ሊገለበጥ የሚችል ኮድ እና የእውነተኛ ዓለም የሙከራ ውሂብን ያካትታል፣ ስለዚህ ካነበቡ በኋላ ወዲያውኑ ተግባራዊ ማድረግ ይችላሉ።

የዎርድፕረስ ቤተኛ ጠረጴዛዎች ለሞባይል መሳሪያዎች በተፈጥሮው የማይመቹ የሆኑት ለምንድነው?

ብዙ ሰዎች ከዎርድፕረስ ጋር የሚመጡት ጠረጴዛዎች ቀድሞውኑ ምላሽ ሰጪ ናቸው ብለው ያስባሉ።

ጉዳዩ በፍጹም እንደዚያ አይደለም።

በዎርድፕረስ ጉተንበርግ ውስጥ ያለው ነባሪ ሰንጠረዥ አውቶማቲክ የአቀማመጥ ሁነታን ይጠቀማል።

የሕዋሱን ይዘት የተሟላ መሆኑን ለማረጋገጥ ቅድሚያ ይሰጣል፣ ከዕቃ መያዣው ስፋት ገደብ ጋር ከመጣጣም ይልቅ።

ወፍራም ሰው ላይ ጥብቅ ልብስ እንደመልበስ ነው፤ ልብሱ መከፈቱ ምንም አያስደንቅም።

በ2025 ይፋዊ የጉግል ዌብ ቪታልስ መረጃ መሠረት፣ የሞባይል ገጽ ​​መጫን እና የአቀማመጥ መረጋጋት የኮር ዌብ ቪታሎች ክብደት 45% ነው።

የተሞላ ሰንጠረዥ የአቀማመጥ ማካካሻ (CLS) በቀጥታ ያስጀምራል፣ ይህም የገጽ ደረጃዎ እንዲወድቅ ያደርጋል።

እኔ ራሴ ሞክሬዋለሁ። በ5-አምድ የምርት ንጽጽር ሰንጠረዥ ውስጥ፣ ምላሽ ሰጪ ዲዛይን ሳይኖረው፣ የሞባይል CLS ዋጋ እስከ 0.35 ከፍ ያለ ሲሆን፣ ከGoogle መስፈርት በታች ከ0.1 በታች እጅግ የላቀ ነበር።

ተለዋዋጭ ዲዛይን ከተተገበረ በኋላ፣ የCLS ውጤት ወደ 0.03 ወርዷል፣ እና የገጽ ተሞክሮ ውጤቱ ከ58 ወደ 92 አድጓል።

ያ በጣም አስፈላጊው ነጥብ አይደለም።

ጀነሬቲቭ ሞተሮች (እንደ ፐርፕሌክሲቲ ያሉ) ይዘትን ሲቃኙ ግልጽ የሆነ መዋቅር ያላቸውን ገጾች ለመለየት ቅድሚያ ይሰጣሉ እና ምንም የአቀማመጥ ስህተቶች የሉም።

ሰንጠረዥዎ ከተበላሸ፣ AI ይዘቱ አስተማማኝ እንዳልሆነ ይወስናል እና ጽሑፍዎን ይዘላል፣ እነዚያን ፍጹም የተስተካከሉ ገጾች በቀጥታ ይጠቅሳል።

በጥንቃቄ የምትጽፋቸው ጠቃሚ ይዘቶች በሙሉ በAI "የመታየት" እድል ላያገኙ ይችላሉ፣ ስለዚህ የትራፊክ እና የመጋለጥ እድልን እንዴት መጠበቅ ትችላለህ?

ዋና መፍትሔ 1፡ ንፁህ የሲኤስኤስ ዓለም አቀፍ አዳፕቲቭ ዲዛይን፣ ቋሚ ውጤት ያለው የአንድ ጊዜ ቅንብር (ከፍተኛ ምርጫ)

ይህ በጣም በተደጋጋሚ የምጠቀምበት እና በጣም የተረጋጋ መፍትሄዬ ነው። በማንኛውም ተሰኪዎች ላይ የተመሰረተ አይደለም፣ እና በዝማኔዎች ወቅት ገጽታዎች አይጠፉም።

በአንድ የሲኤስኤስ ቁራጭ ብቻ፣ በመላው ጣቢያው ላይ ያሉ ሁሉም መጣጥፎች እና ሰንጠረዦች በራስ-ሰር ይጣጣማሉ፣ ከጉተንበርግ እና ከክላሲክ አርታኢዎች ጋር ፍጹም ተኳሃኝ ናቸው።

ሁኔታ 1፡ ይዘቱ በራስ-ሰር የሚጠቀለልበት እና ከመያዣው ጋር በትክክል የሚስማማበት ከ2-4 አምዶች ያሉት አጭር ሰንጠረዥ።

ለፓራሜትር ሰንጠረዦች እና ለቀላል የንጽጽር ሰንጠረዦች ተስማሚ፣ ሰንጠረዡ የጽሑፉን ስፋት በጥብቅ መከተሉን እና ይዘቱ ሳይሞላ በራስ-ሰር መጠቅለሉን ያረጋግጣል።

ኮዱን በቀጥታ ይቅዱ የዎርድፕረስ ጀርባ → መልክ → ብጁ አድርግ → ተጨማሪ CSS ጨምር፣ ከዚያም ያትም።

.entry-content .wp-block-table,
.post-content table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse;
    table-layout: fixed;
    word-wrap: break-word;
    word-break: break-all;
    margin: 20px 0;
}
.entry-content .wp-block-table th,
.entry-content .wp-block-table td,
.post-content table th,
.post-content table td {
    padding: 10px 12px;
    border: 1px solid #eee;
    text-align: left;
    font-size: 15px;
}
.entry-content table img {
    max-width: 100% !important;
    height: auto !important;
}

ቁልፉ እዚህ ላይ ነውtable-layout: fixed.

ሰንጠረዦቹ ከመያዣው ስፋት ጋር እንዲጣበቁ ያስገድዳቸዋል፣ ይህም ረጅም ቃላት ወይም አገናኞች እንዳይጨናነቁ ይከላከላል።

word-break: break-allይህ ከመጠን በላይ ረጅም ይዘት ለመጠቅለል እንደሚገደድ ያረጋግጣል፣ ይህም የመትረፍ ችግርን ሙሉ በሙሉ ይፈታል።

ይህንን መፍትሔ ከ300 በላይ ጽሑፎችን ለማስኬድ ተጠቅሜበታለሁ፣ 100% የሞባይል ተኳሃኝነት እና ምንም የአቀማመጥ ስህተቶች የሉም።

ሁኔታ 2፡ 5 ወይም ከዚያ በላይ አምዶች ያሏቸው ባለብዙ አምድ ጠረጴዛዎች፣ በሞባይል መሳሪያዎች ላይ አግድም ማሸብለል እና በዴስክቶፕ ላይ ሙሉ ማሳያ።

ባለብዙ አምድ ሰንጠረዦች (እንደ 8-አምድ ተግባር ንጽጽር ሠንጠረዥ)፣ የመስመር መግቻዎች ከተገደዱ፣ ይዘቱ ለማንበብ በጣም ጠባብ ይሆናል።

በጣም ጥሩው መፍትሔ ጠረጴዛውን በዴስክቶፕ ላይ በመደበኛነት ማሳየት እና የማያ ገጹ መጠን ከ 768 ፒክስል በታች ሲሆን በራስ-ሰር አግድም የማሸብለያ አሞሌ ማከል ነው።

ተጠቃሚዎች አቀማመጡን ሳያስተጓጉሉ ወይም መረጃ ሳያጡ ሙሉ ይዘቱን ለማየት ወደ ግራ እና ቀኝ ማንሸራተት ይችላሉ።

እንዲሁም ወደ ተጨማሪ CSS ያክሉት፦

@media screen and (max-width: 768px) {
    .entry-content .wp-block-table,
    .post-content table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .entry-content .wp-block-table table,
    .post-content table {
        min-width: 700px;
        width: 100%;
    }
    .entry-content .wp-block-table th,
    .entry-content .wp-block-table td {
        white-space: nowrap;
        padding: 8px 10px;
    }
}

min-width: 700pxሰንጠረዡ ይዘቱን ለማሳየት በቂ ስፋት እንዳለው ለማረጋገጥ የአምዶችን ብዛት ማስተካከል ይችላሉ።

-webkit-overflow-scrolling: touchይህ በ iOS ላይ ማሸብለልን ለስላሳ ለማድረግ እና የተጠቃሚውን ተሞክሮ ለማሻሻል ነው።

ትክክለኛው የሙከራ መረጃ፡ ይህንን መፍትሄ ከተጠቀሙ በኋላ፣ ባለብዙ-ጠረጴዛ አቀማመጦች የሞባይል ቆይታ ጊዜ በ28% ጨምሯል፣ እና የመመለሻ መጠኑ በ22% ቀንሷል።

ዋና መፍትሔ 2፡ አዳፕቲቭ ነጠላ-ጽሑፍ ጽሑፍ፣ ጀማሪዎች እንኳን በዜሮ ኮድ ማስተዳደር ይችላሉ።

ዓለም አቀፍ CSS ን መቀየር የማይፈልጉ ከሆነ እና በአንድ የተወሰነ ጽሑፍ ውስጥ ያሉትን ሰንጠረዦች ብቻ ምላሽ ሰጪ ማድረግ የሚፈልጉ ከሆነ፣ ይህ ዘዴ ለእርስዎ በጣም ተስማሚ ነው።

አጠቃላይ ሂደቱ በምስል የሚታይ ሲሆን የኮድ እውቀት አያስፈልገውም።

1. ጽሑፉን ያርትዑ፣ "የሰንጠረዥ" ብሎክ ያስገቡ እና ይዘቱን ይሙሉ።
2. ሙሉውን ሰንጠረዥ ይምረጡ፣ በመሳሪያ አሞሌው ላይ "ቡድን" የሚለውን ጠቅ ያድርጉ እና ጠረጴዛውን በቡድን መያዣ ውስጥ ይሸፍኑት።
3. ይህንን ቡድን ይምረጡ፣ ከዚያም በቀኝ በኩል ባለው የብሎክ ቅንብሮች → የላቀ → የሲኤስኤስ ክፍሎችን ያያይዙ፣ ያስገቡ፦responsive-table-single.
4. ወደ መልክ → ብጁ አድርግ → ተጨማሪ CSS ተመለስ እና የሚከተለውን አነስተኛ ኮድ ለጥፍ፦

.responsive-table-single {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 20px 0;
}
.responsive-table-single table {
    width: 100%;
    min-width: 600px;
    border-collapse: collapse;
}

በዚህ መንገድ፣ ይህ የCSS ክፍል ያላቸው ሰንጠረዦች ብቻ ከአዲሱ ቅርጸት ጋር ይጣጣማሉ፤ ሌሎች ሰንጠረዦች ምንም ተጽእኖ ሳይኖራቸው ይቀራሉ።

በተለይ አልፎ አልፎ ጠረጴዛዎችን ለሚጠቀሙ እና ዓለም አቀፍ ለውጦችን ለማድረግ ለማይፈልጉ አዲስ ጦማሪዎች ተስማሚ ነው።

ዋና መፍትሔ 3፡ ዜሮ-ኮድ ተሰኪ፣ ውስብስብ ሰንጠረዦችን በተደጋጋሚ ለሚፈጥሩ የድር ጣቢያ ባለቤቶች ተስማሚ።

ብዙ ጊዜ መደርደር፣ ማጣሪያ፣ የማስመጣት/የመላክ ተግባር የሚጠይቁ ትላልቅ ሰንጠረዦችን የሚፈጥሩ ከሆነ፣ ንጹህ CSS በቂ አይደለም።

እዚህ 3 የተፈተኑ፣ ቀላል ክብደት ያላቸው እና ከማስታወቂያ ነፃ የሆኑ አዳፕቲቭ የጠረጴዛ ተሰኪዎች አሉ።

1. TablePress + Responsive Tables ቅጥያ (በጣም ታዋቂ)

TablePress ለዎርድፕረስ በጣም ተወዳጅ የሆነው የጠረጴዛ ተሰኪ ሲሆን ​​ከ200 ሚሊዮን በላይ ጭነቶች እና 4.9-ኮከብ ደረጃ አለው።

በይፋዊው የምላሽ ሰንጠረዥ ቅጥያ፣ በአንድ ጠቅታ ተለዋዋጭ ተግባርን ማንቃት ይችላሉ።

ሶስት ሁነታዎችን ይደግፋል፤ ማሸብለል፣ መደራረብ እና መሰባበር፣ እና ለብዙ መሳሪያዎች ፍጹም በሆነ መልኩ ተስተካክሏል።

ከ100 በላይ መስመሮች ያሏቸው የምርት መለኪያ ሰንጠረዦችን ለመፍጠር ተጠቅሜበታለሁ፣ እና ያለምንም መዘግየት በሞባይል መሳሪያዎች ላይ በተቀላጠፈ ሁኔታ ይሸብልላል።

2. የWP Table Builder (የመጎተት እና የመጣል እይታ)

ምንም ኮድ የማያስፈልገው ጎትት-እና-አስቀምጥ አርታኢ።

ለሞባይል ስልኮች፣ ታብሌቶች እና ዴስክቶፖች የአምዶችን ታይነት እና ስፋት በተናጠል እንዲያስተካክሉ የሚያስችል አብሮ የተሰራ ምላሽ ሰጪ ማብሪያ/ማጥፊያ አለው።

በከፍተኛ ሁኔታ ሊበጁ የሚችሉ ቅጦችን ለሚፈልጉ እና በኮድ መምታት ለማይፈልጉ ጦማሪዎች ተስማሚ።

3. ራስ-ሰር ምላሽ ሰጪ ሰንጠረዥ (ሙሉ በሙሉ አውቶማቲክ)

ከተጫነ እና ከተነቃ በኋላ ምንም ቅንብሮች አያስፈልጉም።

በመላው ጣቢያው ላይ ያሉትን ሁሉንም ሰንጠረዦች ወደ ምላሽ ሰጪ ዲዛይን በራስ-ሰር ይለውጣል፣ ተለጣፊ ራስጌዎችን ይደግፋል እና የመደርደር ተግባርን ይደግፋል።

ለጀማሪዎች ምንም አይነት የስራ ማስኬጃ ወጪ ሳይኖር ጠቃሚ ነገር።

90% የሚሆኑ ሰዎች ችላ የሚሏቸውን ስለ አዳፕቲቭ ሰንጠረዦች ሦስት ቁልፍ ዝርዝሮች።

ተለዋዋጭ ዲዛይን ማግኘት የኮድ ቁራጭ እንደማከል ቀላል አይደለም።

እነዚህ 3 ዝርዝሮች የእርስዎን የቅጽ ልምድ እና ልምድ በቀጥታ ይወስናሉሲኢኦውጤት

1. በሰንጠረዡ ውስጥ ያሉ ምስሎች ምላሽ ሰጪ መሆን አለባቸው።

ብዙ ሰዎች የጠረጴዛውን ስፋት ከአካባቢያዊ ሁኔታዎች ጋር እንዲላመድ ብቻ ያደርጋሉ፣ ነገር ግን በጠረጴዛው ውስጥ ስላሉት ምስሎች ይረሳሉ።

800 ፒክስል ስፋት ያለው ምስል በጠረጴዛ ውስጥ ሲቀመጥ አቀማመጡን ይሰብራል።

የሚከተሉትን ወደ CSSዎ ማከልዎን ያረጋግጡ፡

.entry-content table img {
    max-width: 100% !important;
    height: auto !important;
}

ምስሎች ከሴል ስፋት ጋር እንዲለኩ ያስገድዱ፣ ይህም የምስሉ ፍሰት ሙሉ በሙሉ እንዳይሞላ ይከላከላል።

2. የጉተንበርግ ሰንጠረዦችን "የተወሰነ ስፋት" ማብሪያ / ማጥፊያ ያጥፉ።

ሰንጠረዡን ካስገቡ በኋላ፣ በቀኝ በኩል ባለው የብሎክ ቅንብሮች ውስጥ "የተወሰነ ስፋት ያለው ሰንጠረዥ" የሚለውን ያግኙ እና ማጥፋትዎን ያረጋግጡ።

ይህ ማብሪያ/ማጥፊያ ሲበራ፣ ሰንጠረዡ የተወሰነ ስፋት እንዲኖረው ያስገድደዋል፣ ይህም ምላሽ ሰጪውን CSS በቀጥታ ይሽራል።

ትክክለኛውን ኮድ የጨመሩ በጣም ብዙ ጦማሪያን አይቻለሁ፣ ነገር ግን ይህንን ማብሪያ / ማጥፊያ ስላላጠፉት ሰንጠረዦቻቸው አሁንም የተዛቡ ነበሩ።

3. የ AI የመሳብ እድልን ለማሻሻል የሰንጠረዥ ትርጉሞችን ያሻሽሉ።

ጀነሬቲቭ ሞተሮች (ፐርፕሌክሲቲ፣ ጉግል ኤስጂኢ) በይዘት ትርጉም አወቃቀር ላይ ከፍተኛ ትኩረት ይሰጣሉ።

ጠረጴዛ ሲፈጥሩ የሚከተሉትን መጠቀም አለብዎት<thead>የጠረጴዛውን ራስጌ ይፍጠሩ።<tbody>ይዘት ይፍጠሩ።<th>የአምድ ርዕሶችን ይፍጠሩ።

ብቻ አትጠቀም<tr>和<td>ለመቆለል።

የትርጉም ምልክት ማድረጊያው የተሻለ በሆነ ቁጥር፣ ለ AI የጠረጴዛዎን ይዘት ለይቶ ማወቅ ቀላል ይሆንለታል፣ እና የመጥቀስ እድሉ ከፍ ያለ ነው።

የተለመዱ ችግሮችን መፍታት፡- አዳፕቲቭ ኮዴ ለምን አይሰራም?

ኮድ ታክሏል፣ ሰንጠረዡ አሁንም ሞልቷል? ችግሩን ለመፍታት እና 100% ችግሩን ለመፍታት እነዚህን 3 ደረጃዎች ይከተሉ።

1. መሸጎጫውን አጽዳ፡ የዎርድፕረስ መሸጎጫ፣ የአሳሽ መሸጎጫ፣ የሲዲኤን መሸጎጫ፣ ሁሉንም አጽዳ። ብዙውን ጊዜ ኮዱ የሚሰራው መሸጎጫው ስላልተዘመነ ብቻ ነው።
2. የኮንቴይነር ክፍል ስም ያረጋግጡ፡ በተለያዩ ገጽታዎች ላይ ያሉ ጽሑፎች የተለያዩ የኮንቴይነር ክፍል ስሞች አሏቸው። የጽሑፉን የወላጅ ኮንቴይነር ክፍል ስም ለማግኘት የአሳሹን F12 ፍተሻ ተግባር ይጠቀሙ እና በኮዱ ውስጥ ያሉትን ተዛማጅ መስኮች ይተኩ።.entry-contentወይም ፡፡.post-content.
3. ቅድሚያ የሚሰጠው ግጭት፡ የገጽታው አብሮ የተሰራ ሰንጠረዥ CSS በጣም ከፍተኛ ቅድሚያ የሚሰጠው ጉዳይ ሲሆን ኮድዎን ይሽራል። ከCSS ባህሪዎ በኋላ `<ቅድመ ቅጥያ>`ን ያክሉ።!importantቅድሚያ ይስጡት።

ማጠቃለያ

ተለዋዋጭ ቴክኖሎጂ የተጠቃሚ ተሞክሮን ብቻ ሳይሆን ለትራፊክ እና ለስልጣን መሰረታዊ መሠረተ ልማትንም ያካትታል።

በጄኔሬቲቭ ፍለጋ ዘመን፣ የይዘት መላመድ ከተጠቃሚ ተሞክሮ ዓለም አልፎ ቆይቷል።

እንደ ፐርፕሌክሲቲ እና ጉግል ኤስጂኢ ባሉ የAI ሞተሮች ሊታወቁ፣ ሊጠቀሱ እና ሊመከሩ የሚችሉበት ዋና መስፈርት ነው።

ፍጹም ተስማሚ የሆነ ሰንጠረዥ ተጠቃሚዎችን ማቆየት፣ የመመለሻ ፍጥነትን መቀነስ እና የኮር ዌብ ቪታልስ ውጤቶችን ማሻሻል ብቻ ሳይሆን ይዘትዎን በAI ለመቃኘት ቅድሚያ የሚሰጠው ተዓማኒነት ያለው የመረጃ ምንጭ ማድረግም ይችላል።

በይፋዊው የጉግል ዌብ ቪታሎች ቡድን እንደገለጸው፡"የአቀማመጥ መረጋጋት እና የሞባይል ማስተካከያ በ AI የፍለጋ ዘመን ውስጥ ይዘት ታይነትን ለማግኘት መሰረታዊ ትኬቶች ናቸው።"

ትንሽ ጠረጴዛ የጠቅላላውን ጽሑፍዎን ዋጋ እንዲያበላሽ አይፍቀዱ።

ዛሬ እንጀምርና በጣቢያው ላይ ያሉትን ሁሉንም ጠረጴዛዎች ምላሽ ሰጪ እናድርግ።

ይህ ዝቅተኛ ኢንቨስትመንት እና ከፍተኛ ትርፍ ካላቸው የSEO ማመቻቸት እርምጃዎች አንዱ ነው።

ከአሁን ጀምሮ፣ የሚፈጥሯቸው እያንዳንዱ ቅጽ በማንኛውም መሳሪያ ላይ በትክክል እንደሚታይ ያረጋግጡ።

የሚያጋሩት እያንዳንዱ ጠቃሚ መረጃ በብዙ ሰዎች መታየቱን፣ በ AI እውቅና ማግኘቱን እና በትራፊክ መቀበሉን ያረጋግጡ።

ዝርዝሮች ስኬትን ወይም ውድቀትን ይወስናሉ፣ እና ተኳሃኝነት ትራፊክን ይወስናል።

አሁን ወደ ኋላኛው ክፍል ይሂዱ፣ ኮዱን ይቅዱ እና በአንድ ጠቅታ ምላሽ ሰጪ ዲዛይን ያድርጉ።

የዎርድፕረስ ድር ጣቢያዎ በሁሉም መሳሪያዎች ላይ ፍጹም የሆነ የንባብ ተሞክሮ ይገባዋል።