Артицле Дирецтори
WordPressКако оптимизовати интерне везе на веб локацији?
Креирајте кратке кодове помоћу чланака са сличицама и дугмади за уређивање
Оптимизација интерних линкова веб сајта, инSЕОВезе су одувек биле веома важне, а добра структура веза је веома корисна за СЕО.
Ако је тренутни чланак повезан са другим чланцима, аутоматски додајте везу на страницу:
- ће значајно повећати број и дубину пузања од стране паукова претраживача,
- помоћи да се повећа број записа,
- И тежину кључних речи сидреног текста.
Ако се неки стари чланци ажурирају, можете такође упутити паукове претраживача да поново потраже и индексирају ажурирања садржаја старих чланака додавањем интерних веза новим чланцима.
- Уобичајени облик интерног повезивања је текстуална веза, чија је структура сидрени текст .
- Али да бисмо побољшали корисничко искуство, можемо даље оптимизовати везе до чланака на унутрашњој страници.
кад читашЦхен ВеилиангКада пишете на блогу, често ћете открити да уграђујете образац за картицу чланка као што је овај, са сличицом чланка који садржи резиме садржаја чланка, на пример:
XNUMX. Додајте кратки код у стилу картице са чланком
第 1 步:Додајте ПХП код
Додајте следећи код у датотеку фунцтионс.пхп ваше ВП теме:
/**
* 加入内部文章缩略图 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 文件夹内的图片作缩略图
}
}
}
}Ако се икона хипервезе не појави, потребно је да замените горњуЦССОд овога fa fa-link fa-fw, до sui sui-link sui-fw
- Проверите своју ВП тему, да ли постоји директоријум /имг/рандом/?
- (ако не, креирајте)
- Затим у насумични фајл додајте 20 јпг слика.
Слике су именоване од 1 до 20:
- КСНУМКС.јпг
- КСНУМКС.јпг
- ... (и тако даље)
- КСНУМКС.јпг
第 2 步:Додајте ЦСС код
Додајте следећи код у датотеку стиле.цсс ваше ВП теме:
/*加入内部文章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 чланака
- Овај чланак се користи да би се избегло избегавање кратких кодова []
- Када користите кратки код, промените [] у []
Ефекат је следећи ▼
Ако не користите кратки код у ВордПресс уређивачу и желите да га позовете негде другде, можете га позвати следећим кодом:
do_shortcode（'[neilian ids ids = postID1，postID2]'）
XNUMX. Додајте дугме за уређивање
Ако треба да ручно унесете кратки код сваки пут, делује превише гломазно, шта да радим?
Моћ ВордПресс-а је у томе што нам омогућава да поједноставимо сложене ствари ^_^
1) Дугме за додавање текста уређивача
ВордПресс има уграђен ТиниМЦЕ уређивач подразумевано. Можемо да додамо дугмад за пречице у текстуални интерфејс ТиниМЦЕ едитора.
корак 3:Додајте код дугмета за пречицу
- Молимо додајте код директно у датотеку фунцтионс.пхп ▼
//加入内部文章，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) Додај дугме за визуелизацију уређивача
Када уређујемо ВордПресс чланке, подразумевани интерфејс је обично визуелни.
Дакле, боље је додати дугме иу визуелном уређивачу.
- Иако се ова функционалност може имплементирати у коду, она је мало компликована за многе почетнике.
- То је проблематично за стручњаке, јер ЈС код треба да се дода у тему, а ако се тема промени, треба је поново додати, што је веома гломазно.
第 4 步:Инсталирајте и омогућите додатке
- Цхен ВеилиангПрепоручују се додаци:Прилагођена дугмад Висуал Едитор-а
Након завршетка инсталације, испод леве траке менија, појавиће се прилагођена дугмад визуелног уређивача са иконом зупчаника ▼
第 5 步:Кликните на Додај ново
- Направите прилагођено дугме, било које име.
- На пример: додавање интерних чланака
Само треба да пратите слику испод да бисте подесили ▼
第 6 步: Опција садржаја дугмета
- Изаберите Премотај избор.
第 7 步: Пре подешавања
- Попуните кратки код
корак 8:Прикажи у подешавањима уређивача
- Можете да проверите дугмад за приказ визуелног уређивача или уређивача текста.
- Имајте на уму да ако је Уређивач текста означен, можете прескочити „Додај код дугмета за пречицу“ изнад, иначе ће се поновити.
корак 9:Опције иконе дугмета
- У падајућем менију са опцијама изаберите икону Урамљена.
корак 10:Тест
- На крају, наравно, на вама је да сами тестирате ефекат ^_^
- Ако су горњи кораци тачни, видећете дугме као што је приказано испод у визуелном интерфејсу уређивача ▼
Блог Хопе Цхен Веилианг ( https://www.chenweiliang.com/ ) је поделио „Како додати стил картице чланка у ВордПресс? Уградите кратки код у форму картице чланка“, што вам је од помоћи.
Добродошли да поделите везу овог чланка:https://www.chenweiliang.com/cwl-638.html