வேர்ட்பிரஸில் கட்டுரை அட்டை பாணியை எவ்வாறு சேர்ப்பது? கட்டுரை அட்டை வடிவத்தில் சுருக்குக்குறியீட்டை உட்பொதிக்கவும்

வேர்ட்பிரஸ்இணையதள உள் இணைப்புகளை எவ்வாறு மேம்படுத்துவது?

சிறுபடக் கட்டுரைகள் & எடிட்டர் பொத்தான்கள் மூலம் ஷார்ட்கோட்களை உருவாக்கவும்

இணையதள உள் இணைப்பு மேம்படுத்தல், inஎஸ்சிஓஇணைப்புகள் எப்போதுமே மிகவும் முக்கியமானவை, மேலும் ஒரு நல்ல இணைப்பு அமைப்பு SEO க்கு மிகவும் பயனுள்ளதாக இருக்கும்.

தற்போதைய கட்டுரை மற்ற கட்டுரைகளுடன் தொடர்புடையதாக இருந்தால், தானாகவே பக்கத்திற்கு இணைப்பைச் சேர்க்கவும்:

  • தேடுபொறி சிலந்திகளால் ஊர்ந்து செல்லும் எண்ணிக்கை மற்றும் ஆழத்தை பெரிதும் அதிகரிக்கும்,
  • பதிவுகளின் எண்ணிக்கையை அதிகரிக்க உதவும்,
  • மற்றும் ஆங்கர் உரை முக்கிய வார்த்தைகளின் எடை.

சில பழைய கட்டுரைகள் புதுப்பிக்கப்பட்டால், புதிய கட்டுரைகளுக்கு உள் இணைப்புகளைச் சேர்ப்பதன் மூலம் பழைய கட்டுரைகளின் உள்ளடக்க புதுப்பிப்புகளை மீண்டும் வலைவலம் செய்து அட்டவணையிடுமாறு தேடுபொறி சிலந்திகளுக்கு நீங்கள் அறிவுறுத்தலாம்.

  • உள் இணைப்பின் பொதுவான வடிவம் ஒரு உரை இணைப்பு ஆகும், அதன் அமைப்பு நங்கூர உரை ஆகும்.
  • ஆனால் பயனர் அனுபவத்தை மேம்படுத்தும் வகையில், உள் பக்கத்தில் உள்ள கட்டுரை இணைப்புகளை மேலும் மேம்படுத்தலாம்.

நீங்கள் படிக்கும் போதுசென் வெலியாங்வலைப்பதிவு செய்யும் போது, ​​கட்டுரையின் உள்ளடக்கத்தின் சுருக்கத்தைக் கொண்ட சிறுபடக் கட்டுரையுடன் இது போன்ற கட்டுரை அட்டைப் படிவத்தை உட்பொதிப்பதை நீங்கள் அடிக்கடி காணலாம், எடுத்துக்காட்டாக:

XNUMX. உட்பொதிக்கப்பட்ட கட்டுரை அட்டை பாணி சுருக்குக்குறியீட்டைச் சேர்க்கவும்

சுமார் 1 வது:PHP குறியீட்டைச் சேர்க்கவும்

உங்கள் WP தீமின் செயல்பாடுகள்.php கோப்பில் பின்வரும் குறியீட்டைச் சேர்க்கவும்:

/**
* 加入内部文章缩略图 By 陈沩亮
* 文章地址:https://www.chenweiliang.com/cwl-638.html
**/
function cwl_insert_posts( $atts, $content = null ){
extract( shortcode_atts( array(
'ids' => ''
),
$atts ) );
global $post;
$content = '';
$postids = explode(',', $ids);
$inset_posts = get_posts(array('post__in'=>$postids));
foreach ($inset_posts as $key => $post) {
setup_postdata( $post );
$content .= '<div class="jiawen"><div class="fl"><a target="_blank" href="' . get_permalink() . '" class="fl"><i class="sui sui-link sui-fw"></i>';
$content .= get_the_title();
$content .= '</a><p class="note"><a target="_blank" rel="nofollow" href="' . get_permalink() . '">';
$content .= mb_strimwidth(strip_tags(apply_filters('post_content', $post->post_content)), 0, 180, '...');
$content .= '</a></p></div><div class="fr"><a target="_blank" rel="nofollow" href="' . get_permalink() . '"><img src=';
$content .= cwl_thumbnail_src();
$content .= ' class="jiawen-thumb" alt="' . get_the_title() . '" title="' . get_the_title() . '"></a></div></div>';
}
wp_reset_postdata();
return $content;
}
add_shortcode('jiawen', 'cwl_insert_posts');

// 加入内部文章缩略图
function cwl_thumbnail_src() {
global $post;
if ( get_post_meta($post->ID, 'thumbnail', true) ) { //如有缩略图,就显示缩略图
$image = get_post_meta($post->ID, 'thumbnail', true);
return $image;
} else {
if ( has_post_thumbnail() ) { //如有缩略图,就显示缩略图
$img_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "Full");
return $img_src[0];
} else {
$content = $post->post_content;
preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
$n = count($strResult[1]);
if($n > 0){
return $strResult[1][0]; //若无缩略图,就调用文中第一张图片作缩略图
}else {
$random = mt_rand(1, 20);
return get_template_directory_uri().'/img/random/'. $random .'.jpg'; //文章中若无图片,就随机读取在 random 文件夹内的图片作缩略图
}
}
}
}

ஹைப்பர்லிங்க் ஐகான் தோன்றவில்லை என்றால், நீங்கள் மேலே உள்ளதை மாற்ற வேண்டும்CSS ஐஇதனுடைய fa fa-link fa-fw, செய்ய sui sui-link sui-fw

  • உங்கள் WP தீம் சரிபார்க்கவும், /img/random/ கோப்புறை உள்ளதா?
  • (இல்லையெனில், உருவாக்கவும்)
  • பின்னர் சீரற்ற கோப்பில், 20 jpg படங்களைச் சேர்க்கவும்.

படங்கள் 1 முதல் 20 வரை பெயரிடப்பட்டுள்ளன:

  • 1.jpg
  • 2.jpg
  • ... (மற்றும் பல)
  • 20.jpg

சுமார் 2 வது:CSS குறியீட்டைச் சேர்க்கவும்

உங்கள் WP தீமின் style.css கோப்பில் பின்வரும் குறியீட்டைச் சேர்க்கவும்:

/*加入内部文章CSS*/
.fl{float:left;}
.fr{float:right;}
.jiawen{margin-bottom:25px;padding:10px;width:100%;height:100%;border:1px solid #e8e8e8;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.1);cursor:pointer;-webkit-transition:box-shadow 218ms;-moz-transition:box-shadow 218ms;-o-transition:box-shadow 218ms;transition:box-shadow 218ms;overflow:hidden;}
.jiawen:hover{box-shadow:0 1px 8px 1px rgba(0,0,0,.1);}
.jiawen .fl{width:72%;}
.jiawen .fr{padding:10px 5px;width:24%;}
.jiawen .fl a{display:block;margin-right:15px;padding:8px 0;width:100%;height: 100%;color:#8463a9!important;text-decoration:none;font-size:16px;border:none;overflow: hidden;}
.jiawen .fl .note{margin:0 0 5px;padding-left:10px;height:150px;color:#888;font-size:14px;}
.jiawen .jiawen-thumb{width:170px;height:120px;margin-top: 10px;}
@media only screen and (max-width: 700px){.jiawen .jiawen-thumb {width: auto;height: auto;}}

XNUMX. உட்பொதிக்கப்பட்ட கட்டுரை அட்டை (குறுகிய குறியீடு) வடிவத்தில் குறுகிய குறியீட்டை அழைக்கவும்

கட்டுரை எடிட்டரின் "காட்சி" அல்லது "உரை" இடைமுகத்தில் நீங்கள் சுருக்குக்குறியீட்டை நேரடியாக உள்ளிடலாம் 【jiawen ids =postID1,postID2 ...】 வடிவ அழைப்பு.

எடுத்துக்காட்டாக, உள்நாட்டில் இணைக்கப்பட்ட 3 கட்டுரைகளைக் காட்ட விரும்பினால், சுருக்குக்குறியீட்டை நேரடியாக உள்ளிடுகிறேன்:

  • 【jiawen ids=526,380,411】
  • நீங்கள் 5 கட்டுரைகளுக்கு மேல் ஐடிகளை உள்ளிட்டால், அதிகபட்சம் 5 கட்டுரைகள் மட்டுமே காட்டப்படும்
  • ஷார்ட்கோட்கள் தப்பிக்காமல் இருக்க இந்தக் கட்டுரை பயன்படுத்தப்படுகிறது []
  • சுருக்குக்குறியீட்டைப் பயன்படுத்தும் போது, ​​தயவுசெய்து [] என்பதை [] என மாற்றவும்

விளைவு பின்வருமாறு ▼

புதிய ஊடக சகாப்தத்தில் பயனர்களின் வாசிப்பின் உளவியல் பண்புகளின் பகுப்பாய்வு: இந்த 7 ஐ நீங்கள் தேர்ச்சி பெற்றால், நீங்கள் சம்பாதிக்கலாம்

புதிய ஊடக சகாப்தத்தில் பயனர்களின் வாசிப்பு உளவியலின் சிறப்பியல்புகளின் பகுப்பாய்வு: இந்த 7 ஐ நீங்கள் தேர்ச்சி பெற்றால், நீங்கள் பணம் சம்பாதிப்பீர்கள் அறிமுகம்: WeChat பொதுக் கணக்காக நாம் வெற்றிபெற விரும்பினால், நாம் மனித இயல்புகளைப் படிக்க வேண்டும், பயனர்களின் வாசிப்பை பகுப்பாய்வு செய்ய வேண்டும். உளவியல், மற்றும் பயனர்களின் வாசிப்பு நடத்தையை புரிந்துகொள்வதன் மூலம் மட்டுமே, இந்த வழியில் மட்டுமே நாம் செய்வதை மேம்படுத்த முடியும்.

புதிய ஊடக சகாப்தத்தில் பயனர்களின் வாசிப்பின் உளவியல் பண்புகளின் பகுப்பாய்வு: இந்த 7 ஐ நீங்கள் தேர்ச்சி பெற்றால், நீங்கள் 4வது சம்பாதிப்பீர்கள்

நீங்கள் வேர்ட்பிரஸ் எடிட்டரில் சுருக்குக்குறியீட்டைப் பயன்படுத்தவில்லை என்றால், அதை வேறு எங்கும் அழைக்க விரும்பினால், பின்வரும் குறியீட்டைக் கொண்டு அதை அழைக்கலாம்:

do_shortcode('[neilian ids ids = postID1,postID2]')

XNUMX. எடிட்டர் பட்டனைச் சேர்க்கவும்

ஒவ்வொரு முறையும் நீங்கள் சுருக்குக்குறியீட்டை கைமுறையாக உள்ளிட வேண்டும் என்றால், அது மிகவும் சிரமமாக இருக்கிறது, நான் என்ன செய்ய வேண்டும்?

WordPress இன் சக்தி என்னவென்றால், இது சிக்கலான விஷயங்களை எளிமைப்படுத்த அனுமதிக்கிறது ^_^

1) எடிட்டர் டெக்ஸ்ட் பட்டனைச் சேர்க்கவும்

வேர்ட்பிரஸ் இயல்பாகவே உள்ளமைக்கப்பட்ட TinyMCE எடிட்டரைக் கொண்டுள்ளது. TinyMCE எடிட்டர் உரை இடைமுகத்தில் குறுக்குவழி பொத்தான்களைச் சேர்க்கலாம்.

படி 3:குறுக்குவழி பொத்தான் குறியீட்டைச் சேர்க்கவும்

  • ▼ functions.php கோப்பில் குறியீட்டை நேரடியாகச் சேர்க்கவும்
//加入内部文章,TinyMCE 编辑器文本按钮
add_action('after_wp_tiny_mce', 'add_button_mce');
function add_button_mce($mce_settings) {
?>
<script type="text/javascript">
 QTags.addButton( 'jw', '加入内部文章', '', '');
 </script>
<?php
}

வேர்ட்பிரஸ் இணையதளத்தின் உள் இணைப்புகளை எவ்வாறு மேம்படுத்துவது? சிறுபடத்துடன் இடுகை சுருக்குக்குறியீடு & எடிட்டர் பொத்தானை உருவாக்கவும்

முன்னெச்சரிக்கைகள்

குறுக்குவழி பொத்தான்களைத் தனிப்பயனாக்க எடிட்டருக்கு வேறு குறியீட்டைச் சேர்த்திருந்தால், வெறும்<script type="text/javascript"> கீழே, பின்வரும் குறியீட்டைச் சேர்க்கவும் ▼

QTags.addButton( 'jw', '加入内部文章', '', '');

இல்லையெனில் அது தவறாகிவிடும்.

2) எடிட்டர் காட்சிப்படுத்தல் பொத்தானைச் சேர்க்கவும்

நாம் வேர்ட்பிரஸ் கட்டுரைகளைத் திருத்தும்போது, ​​இயல்புநிலை இடைமுகம் பொதுவாக விஷுவலாக இருக்கும்.

எனவே, விஷுவல் எடிட்டரிலும் ஒரு பட்டனைச் சேர்ப்பது நல்லது.

  • இந்த செயல்பாடு குறியீட்டில் செயல்படுத்தப்படலாம் என்றாலும், பல புதியவர்களுக்கு இது சற்று சிக்கலானது.
  • இது நிபுணர்களுக்கு தொந்தரவாக உள்ளது, ஏனெனில் தீமில் JS குறியீட்டைச் சேர்ப்பது அவசியம், மேலும் நீங்கள் தீம் மாற்றினால், அதை மீண்டும் சேர்க்க வேண்டும், மேலும் படிகள் குறிப்பாக சிக்கலானவை.

சுமார் 4 வது:செருகுநிரல்களை நிறுவி இயக்கவும்

  • சென் வெலியாங்செருகுநிரல்கள் பரிந்துரைக்கப்படுகின்றன:விஷுவல் எடிட்டர் தனிப்பயன் பொத்தான்கள்

நிறுவல் முடிந்ததும், இடது மெனு பட்டியின் கீழ், கியர் ஐகானுடன் கூடிய விஷுவல் எடிட்டர் கஸ்டம் பட்டன்கள் தோன்றும் ▼

வேர்ட்பிரஸ் கீழ் இடது மூலையில் உள்ள மெனு விஷுவல் எடிட்டர் தனிப்பயன் பட்டன்கள் செருகுநிரல் எண். 6

சுமார் 5 வது:புதியதைச் சேர் என்பதைக் கிளிக் செய்யவும்

  • தனிப்பயன் பட்டனை, எந்தப் பெயரிலும் உருவாக்கவும்.
  • எடுத்துக்காட்டாக: உள் கட்டுரைகளைச் சேர்த்தல் 

▼ஐ அமைக்க, கீழே உள்ள படத்தைப் பின்தொடர வேண்டும்

விஷுவல் எடிட்டர் தனிப்பயன் பொத்தான்கள் செருகுநிரல்: கட்டுரை #7 இன் உள்ளே சேர்

சுமார் 6 வது: பொத்தான் உள்ளடக்க விருப்பம்

  • மடக்கு தேர்வைத் தேர்ந்தெடுக்கவும்.

சுமார் 7 வது: அமைப்பதற்கு முன்

  • சுருக்குக்குறியீட்டை நிரப்பவும்

படி 8:எடிட்டர் அமைப்புகளில் காட்சி

  • விஷுவல் எடிட்டர் அல்லது டெக்ஸ்ட் எடிட்டர் ஷோ பட்டன்களை நீங்கள் பார்க்கலாம்.
  • உரை திருத்தி சரிபார்க்கப்பட்டால், மேலே உள்ள "குறுக்குவழி பொத்தான் குறியீட்டைச் சேர்" என்பதைத் தவிர்க்கலாம், இல்லையெனில் அது மீண்டும் மீண்டும் செய்யப்படும்.

படி 9:பொத்தான் ஐகான் விருப்பங்கள்

  • கீழ்தோன்றும் விருப்பங்கள் மெனுவில், கட்டமைக்கப்பட்ட ஐகானைத் தேர்ந்தெடுக்கவும்.

படி 10:டெஸ்ட்

  • இறுதியில், நிச்சயமாக, விளைவை நீங்களே சோதித்துப் பார்ப்பது உங்களுடையது ^_^
  • மேலே உள்ள படிகள் சரியாக இருந்தால், எடிட்டர் காட்சி இடைமுகம் ▼ இல் கீழே காட்டப்பட்டுள்ளபடி பொத்தானைக் காண்பீர்கள் 

வேர்ட்பிரஸ் விஷுவல் எடிட்டர் ஃபிரேம் செய்யப்பட்ட ஐகான் பட்டன் தாள் 8

ஹோப் சென் வெலியாங் வலைப்பதிவு ( https://www.chenweiliang.com/ ) பகிரப்பட்டது "WordPress இல் கட்டுரை அட்டை பாணியை எவ்வாறு சேர்ப்பது? கட்டுரை அட்டை வடிவத்தில் சுருக்குக்குறியீட்டை உட்பொதிக்கவும்", இது உங்களுக்கு உதவியாக இருக்கும்.

இந்தக் கட்டுரையின் இணைப்பைப் பகிர வரவேற்கிறோம்:https://www.chenweiliang.com/cwl-638.html

மேலும் மறைக்கப்பட்ட தந்திரங்களைத் திறக்க🔑, எங்கள் டெலிகிராம் சேனலில் சேர வரவேற்கிறோம்!

பிடித்திருந்தால் லைக் செய்து பகிருங்கள்! உங்களின் ஷேர்களும் லைக்குகளும் எங்களின் தொடர் உந்துதலாகும்!

 

发表 评论

உங்கள் மின்னஞ்சல் முகவரி வெளியிடப்படாது. தேவையான புலங்கள் பயன்படுத்தப்படுகின்றன * லேபிள்

டாப் உருட்டு