回答編集履歴
2
要望に合わせて修正
answer
CHANGED
|
@@ -1,44 +1,12 @@
|
|
|
1
|
-
回答を全面的に変更し、「おそらく希望はこうではないか」という状態のものに書き換えています。
|
|
2
|
-
|
|
1
|
+
要望がなんとなく判明したのでさらに書き換えました。
|
|
2
|
+
「トップページにカテゴリー一覧（リスト）を表示させる」
|
|
3
|
+
「トップページには各カテゴリーのタイトルとそれに所属する記事を画像（150*150）とタイトルで表示→個別ページにリンク」
|
|
4
|
+
「アーカイブページもトップページと同じような見た目で表示」
|
|
3
5
|
|
|
4
|
-
[サンプルサイト](http://milchkrone.com/
|
|
6
|
+
[サンプルサイト](http://milchkrone.com/dit20201204/)
|
|
5
7
|
|
|
6
|
-
・デザインはなるべく他の部分と合うようにしたけど適当。
|
|
7
|
-
・プラグイン不使用のため画像表示のEasy FancyBoxとかを使ってそうな挙動はすべて無視。
|
|
8
|
-
|
|
9
|
-
◆一覧にアイキャッチを表示、アイキャッチがなければ投稿中の一番初めの画像を表示、それもなければ代替画像を表示
|
|
10
|
-
[参考サイト](https://qiita.com/ryujisanagi/items/96d5d67bb9fc4cf8315a)
|
|
11
|
-
|
|
8
|
+
◆index.phpをすべて下記に書き換える↓
|
|
12
9
|
```php
|
|
13
|
-
/*
|
|
14
|
-
アイキャッチ画像が設定してある場合はそれを取得し出力
|
|
15
|
-
アイキャッチは無いが投稿内に画像がある場合は、そのうちの1番最初の画像を取得し出力
|
|
16
|
-
それも無い場合は代替画像を出力 or 何もしない
|
|
17
|
-
https://qiita.com/ryujisanagi/items/96d5d67bb9fc4cf8315a
|
|
18
|
-
*/
|
|
19
|
-
function catch_thumbnail_image($get_size = 'thumbnail', $altimg_id = null) {
|
|
20
|
-
global $post;
|
|
21
|
-
$image = '';
|
|
22
|
-
$image_get = preg_match_all( '/<img.+class=[\'"].*wp-image-([0-9]+).*[\'"].*>/i', $post->post_content, $matches );
|
|
23
|
-
$image_id = $matches[1][0];
|
|
24
|
-
if( !$image_id && $altimg_id ){
|
|
25
|
-
$image_id = $altimg_id;
|
|
26
|
-
}
|
|
27
|
-
$image = wp_get_attachment_image( $image_id, $get_size, false, array(
|
|
28
|
-
'class' => 'thumbnail-image',
|
|
29
|
-
'srcset' => wp_get_attachment_image_srcset( $image_id, $get_size ),
|
|
30
|
-
'sizes' => wp_get_attachment_image_sizes( $image_id, $get_size )
|
|
31
|
-
) );
|
|
32
|
-
if( empty($image) ) {
|
|
33
|
-
$image = '<img src="https://placehold.jp/cfcfcf/ffffff/150x150.png?text=NO%20IMAGE">'; /* 代替画像のアドレスを指定する */
|
|
34
|
-
}
|
|
35
|
-
return $image;
|
|
36
|
-
}
|
|
37
|
-
```
|
|
38
|
-
|
|
39
|
-
◆カテゴリー一覧の表示、アーカイブを一覧表示に変更
|
|
40
|
-
index.php全部書き換え↓
|
|
41
|
-
```php
|
|
42
10
|
<?php
|
|
43
11
|
/**
|
|
44
12
|
* The main template file
|
|
@@ -59,8 +27,6 @@
|
|
|
59
27
|
?>
|
|
60
28
|
|
|
61
29
|
<main id="site-content" role="main">
|
|
62
|
-
|
|
63
|
-
|
|
64
30
|
<div class="category_list"><!-- カテゴリ一覧の表示 ここから -->
|
|
65
31
|
<ul>
|
|
66
32
|
<?php
|
|
@@ -72,135 +38,122 @@
|
|
|
72
38
|
</ul>
|
|
73
39
|
</div><!-- カテゴリ一覧の表示 ここまで -->
|
|
74
40
|
|
|
75
|
-
|
|
41
|
+
<?php if ( is_home() ) { ?>
|
|
76
42
|
<?php
|
|
43
|
+
$categories = get_categories();
|
|
44
|
+
foreach($categories as $category) :
|
|
45
|
+
?>
|
|
46
|
+
<hr class="post-separator styled-separator is-style-wide section-inner" aria-hidden="true" />
|
|
47
|
+
<div class="has-text-align-center"><h2><a href="<?php echo get_category_link( $category->term_id ); ?>"><?php echo $category->cat_name; ?></a></h2></div>
|
|
48
|
+
<?php
|
|
49
|
+
query_posts('cat='.$category->cat_ID.'&showposts=-1');
|
|
50
|
+
if (have_posts()) : ?>
|
|
51
|
+
<div class="ex-list">
|
|
52
|
+
<?php while (have_posts()) : the_post(); ?>
|
|
53
|
+
<div><a href="<?php the_permalink(); ?>"><?php if(has_post_thumbnail()): ?><img src="<?php the_post_thumbnail_url( 'thumbnail' ); ?>"><?php else: ?><img src="http://placehold.jp/cfcfcf/ffffff/150x150.png?text=NO%20IMAGE"><?php endif; ?><?php the_title(); ?></a></div>
|
|
54
|
+
<?php endwhile; ?>
|
|
55
|
+
</div>
|
|
56
|
+
<?php endif; ?>
|
|
57
|
+
<?php endforeach; ?>
|
|
77
58
|
|
|
78
|
-
$archive_title = '';
|
|
79
|
-
$archive_subtitle = '';
|
|
80
59
|
|
|
81
|
-
if ( is_search() ) {
|
|
82
|
-
|
|
60
|
+
<?php }else{ ?>
|
|
61
|
+
<?php
|
|
83
62
|
|
|
84
|
-
|
|
63
|
+
$archive_title = '';
|
|
85
|
-
|
|
64
|
+
$archive_subtitle = '';
|
|
86
|
-
'<span class="color-accent">' . __( 'Search:', 'twentytwenty' ) . '</span>',
|
|
87
|
-
'“' . get_search_query() . '”'
|
|
88
|
-
);
|
|
89
65
|
|
|
90
|
-
if ( $wp_query->found_posts ) {
|
|
91
|
-
$archive_subtitle = sprintf(
|
|
92
|
-
/* translators: %s: Number of search results. */
|
|
93
|
-
_n(
|
|
94
|
-
'We found %s result for your search.',
|
|
95
|
-
'We found %s results for your search.',
|
|
96
|
-
$wp_query->found_posts,
|
|
97
|
-
'twentytwenty'
|
|
98
|
-
),
|
|
99
|
-
number_format_i18n( $wp_query->found_posts )
|
|
100
|
-
);
|
|
101
|
-
} else {
|
|
102
|
-
$archive_subtitle = __( 'We could not find any results for your search. You can give it another try through the search form below.', 'twentytwenty' );
|
|
103
|
-
}
|
|
104
|
-
} elseif ( is_archive() && ! have_posts() ) {
|
|
105
|
-
$archive_title = __( 'Nothing Found', 'twentytwenty' );
|
|
106
|
-
|
|
66
|
+
if ( is_search() ) {
|
|
107
|
-
|
|
67
|
+
global $wp_query;
|
|
108
|
-
$archive_subtitle = get_the_archive_description();
|
|
109
|
-
}
|
|
110
68
|
|
|
111
|
-
|
|
69
|
+
$archive_title = sprintf(
|
|
70
|
+
'%1$s %2$s',
|
|
71
|
+
'<span class="color-accent">' . __( 'Search:', 'twentytwenty' ) . '</span>',
|
|
72
|
+
'“' . get_search_query() . '”'
|
|
112
|
-
|
|
73
|
+
);
|
|
113
74
|
|
|
75
|
+
if ( $wp_query->found_posts ) {
|
|
76
|
+
$archive_subtitle = sprintf(
|
|
77
|
+
/* translators: %s: Number of search results. */
|
|
78
|
+
_n(
|
|
79
|
+
'We found %s result for your search.',
|
|
80
|
+
'We found %s results for your search.',
|
|
81
|
+
$wp_query->found_posts,
|
|
82
|
+
'twentytwenty'
|
|
83
|
+
),
|
|
84
|
+
number_format_i18n( $wp_query->found_posts )
|
|
85
|
+
);
|
|
86
|
+
} else {
|
|
87
|
+
$archive_subtitle = __( 'We could not find any results for your search. You can give it another try through the search form below.', 'twentytwenty' );
|
|
88
|
+
}
|
|
89
|
+
} elseif ( is_archive() && ! have_posts() ) {
|
|
114
|
-
|
|
90
|
+
$archive_title = __( 'Nothing Found', 'twentytwenty' );
|
|
91
|
+
} elseif ( ! is_home() ) {
|
|
92
|
+
$archive_title = get_the_archive_title();
|
|
93
|
+
$archive_subtitle = get_the_archive_description();
|
|
94
|
+
}
|
|
115
95
|
|
|
116
|
-
|
|
96
|
+
if ( $archive_title || $archive_subtitle ) {
|
|
97
|
+
?>
|
|
117
98
|
|
|
118
|
-
<?php if ( $archive_title ) { ?>
|
|
119
|
-
|
|
99
|
+
<header class="archive-header has-text-align-center header-footer-group">
|
|
120
|
-
<?php } ?>
|
|
121
100
|
|
|
122
|
-
|
|
101
|
+
<div class="archive-header-inner section-inner medium">
|
|
123
|
-
<div class="archive-subtitle section-inner thin max-percentage intro-text"><?php echo wp_kses_post( wpautop( $archive_subtitle ) ); ?></div>
|
|
124
|
-
<?php } ?>
|
|
125
102
|
|
|
126
|
-
|
|
103
|
+
<?php if ( $archive_title ) { ?>
|
|
104
|
+
<h1 class="archive-title"><?php echo wp_kses_post( $archive_title ); ?></h1>
|
|
105
|
+
<?php } ?>
|
|
127
106
|
|
|
128
|
-
|
|
107
|
+
<?php if ( $archive_subtitle ) { ?>
|
|
108
|
+
<div class="archive-subtitle section-inner thin max-percentage intro-text"><?php echo wp_kses_post( wpautop( $archive_subtitle ) ); ?></div>
|
|
109
|
+
<?php } ?>
|
|
129
110
|
|
|
130
|
-
|
|
111
|
+
</div><!-- .archive-header-inner -->
|
|
131
|
-
}
|
|
132
112
|
|
|
113
|
+
</header><!-- .archive-header -->
|
|
114
|
+
|
|
115
|
+
<?php
|
|
116
|
+
}
|
|
117
|
+
|
|
133
|
-
|
|
118
|
+
if ( have_posts() ) {
|
|
134
|
-
if ( is_archive() ) {
|
|
135
119
|
?>
|
|
136
120
|
<div class="ex-list">
|
|
121
|
+
<?php while ( have_posts() ) { the_post(); ?>
|
|
122
|
+
<div><a href="<?php the_permalink(); ?>"><?php if(has_post_thumbnail()): ?><img src="<?php the_post_thumbnail_url( 'thumbnail' ); ?>"><?php else: ?><img src="http://placehold.jp/cfcfcf/ffffff/150x150.png?text=NO%20IMAGE"><?php endif; ?><?php the_title(); ?></a></div>
|
|
123
|
+
<?php } ?>
|
|
124
|
+
</div>
|
|
137
125
|
<?php
|
|
138
|
-
|
|
126
|
+
} elseif ( is_search() ) {
|
|
139
|
-
the_post();
|
|
140
|
-
|
|
127
|
+
?>
|
|
141
|
-
<div>
|
|
142
|
-
<a href="<?php the_permalink(); ?>">
|
|
143
|
-
<?php $catch_thumbnail_size = 'thumbnail'; if(has_post_thumbnail()){ the_post_thumbnail($catch_thumbnail_size); } else { echo catch_thumbnail_image($catch_thumbnail_size); } ?>
|
|
144
|
-
<?php the_title(); ?>
|
|
145
|
-
</a>
|
|
146
|
-
</div>
|
|
147
|
-
<?php
|
|
148
|
-
}
|
|
149
|
-
?>
|
|
150
|
-
</div><!-- end of .category-list -->
|
|
151
|
-
<?php
|
|
152
|
-
}else{
|
|
153
128
|
|
|
154
|
-
|
|
129
|
+
<div class="no-search-results-form section-inner thin">
|
|
155
130
|
|
|
131
|
+
<?php
|
|
156
|
-
|
|
132
|
+
get_search_form(
|
|
133
|
+
array(
|
|
134
|
+
'label' => __( 'search again', 'twentytwenty' ),
|
|
135
|
+
)
|
|
136
|
+
);
|
|
137
|
+
?>
|
|
157
138
|
|
|
139
|
+
</div><!-- .no-search-results -->
|
|
158
140
|
|
|
159
|
-
$i++;
|
|
160
|
-
|
|
141
|
+
<?php
|
|
161
|
-
echo '<hr class="post-separator styled-separator is-style-wide section-inner" aria-hidden="true" />';
|
|
162
|
-
|
|
142
|
+
}
|
|
163
|
-
|
|
143
|
+
?>
|
|
164
144
|
|
|
165
|
-
get_template_part( 'template-parts/content', get_post_type() );
|
|
166
|
-
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
} elseif ( is_search() ) {
|
|
172
|
-
?>
|
|
173
|
-
|
|
174
|
-
<div class="no-search-results-form section-inner thin">
|
|
175
|
-
|
|
176
|
-
<?php
|
|
177
|
-
get_search_form(
|
|
178
|
-
array(
|
|
179
|
-
'label' => __( 'search again', 'twentytwenty' ),
|
|
180
|
-
)
|
|
181
|
-
);
|
|
182
|
-
?>
|
|
183
|
-
|
|
184
|
-
</div><!-- .no-search-results -->
|
|
185
|
-
|
|
186
|
-
<?php
|
|
187
|
-
}
|
|
188
|
-
?>
|
|
189
|
-
|
|
190
|
-
|
|
145
|
+
<?php get_template_part( 'template-parts/pagination' ); ?>
|
|
191
|
-
|
|
146
|
+
<?php } ?>
|
|
192
147
|
</main><!-- #site-content -->
|
|
193
148
|
|
|
194
149
|
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
|
|
195
150
|
|
|
196
151
|
<?php
|
|
197
152
|
get_footer();
|
|
198
|
-
|
|
199
153
|
```
|
|
200
154
|
|
|
201
|
-
◆見た目の調整
|
|
202
|
-
[外観]-[カスタマイズ]-[追加CSS]に追記↓
|
|
155
|
+
◆[外観]-[カスタマイズ]-[追加CSS]に追記↓
|
|
203
|
-
flexbox使用。横幅700px以上で横4つ、それより小さい場合は横2つ
|
|
156
|
+
（flexbox使用。横幅700px以上で横4つ、それより小さい場合は横2つ）
|
|
204
157
|
```css
|
|
205
158
|
.category_list{
|
|
206
159
|
padding:4rem 0 0;
|
|
@@ -215,7 +168,6 @@
|
|
|
215
168
|
width: calc(100% - 4rem);
|
|
216
169
|
padding:4rem 0 0;
|
|
217
170
|
max-width: 58rem;
|
|
218
|
-
width: calc(100% - 4rem);
|
|
219
171
|
margin-left: auto;
|
|
220
172
|
margin-right: auto;
|
|
221
173
|
}
|
|
@@ -223,16 +175,17 @@
|
|
|
223
175
|
width:50%;
|
|
224
176
|
padding: .5em;
|
|
225
177
|
}
|
|
226
|
-
|
|
178
|
+
.ex-list img{
|
|
179
|
+
display:block;
|
|
180
|
+
}
|
|
227
181
|
@media (min-width: 700px){
|
|
228
|
-
.ex-list{
|
|
229
|
-
padding:8rem 0 0;
|
|
230
|
-
}
|
|
231
182
|
.ex-list>div{
|
|
232
183
|
width:25%;
|
|
233
184
|
}
|
|
234
185
|
}
|
|
235
186
|
```
|
|
236
187
|
|
|
237
|
-
|
|
188
|
+
書き換える部分を極力少なくしました。
|
|
238
|
-
|
|
189
|
+
index.phpとカスタマイズの所の追加CSSだけです。
|
|
190
|
+
|
|
191
|
+
※テーマの更新があった場合カスタマイズした内容が元に戻る可能性がありますので子テーマの作成をお勧めします。（子テーマについては知らなければまずは調べていただき、わからなければまた質問してください。）
|
1
追記編集
answer
CHANGED
|
@@ -1,10 +1,44 @@
|
|
|
1
|
+
回答を全面的に変更し、「おそらく希望はこうではないか」という状態のものに書き換えています。
|
|
1
|
-
「
|
|
2
|
+
「希望通りではないと思うがエラーが出ない状態」のコードは編集履歴を参考。
|
|
2
|
-
具体的には95行目、105行目、106行目に全角空白が入っていたり、
|
|
3
|
-
必要なコードを削除してしまっていたり、不必要な`}`が入っていたので修正しました。
|
|
4
3
|
|
|
5
|
-
|
|
4
|
+
[サンプルサイト](http://milchkrone.com/sample20201126/)
|
|
6
5
|
|
|
6
|
+
・デザインはなるべく他の部分と合うようにしたけど適当。
|
|
7
|
+
・プラグイン不使用のため画像表示のEasy FancyBoxとかを使ってそうな挙動はすべて無視。
|
|
8
|
+
|
|
9
|
+
◆一覧にアイキャッチを表示、アイキャッチがなければ投稿中の一番初めの画像を表示、それもなければ代替画像を表示
|
|
10
|
+
[参考サイト](https://qiita.com/ryujisanagi/items/96d5d67bb9fc4cf8315a)
|
|
11
|
+
functions.phpに追加↓
|
|
7
12
|
```php
|
|
13
|
+
/*
|
|
14
|
+
アイキャッチ画像が設定してある場合はそれを取得し出力
|
|
15
|
+
アイキャッチは無いが投稿内に画像がある場合は、そのうちの1番最初の画像を取得し出力
|
|
16
|
+
それも無い場合は代替画像を出力 or 何もしない
|
|
17
|
+
https://qiita.com/ryujisanagi/items/96d5d67bb9fc4cf8315a
|
|
18
|
+
*/
|
|
19
|
+
function catch_thumbnail_image($get_size = 'thumbnail', $altimg_id = null) {
|
|
20
|
+
global $post;
|
|
21
|
+
$image = '';
|
|
22
|
+
$image_get = preg_match_all( '/<img.+class=[\'"].*wp-image-([0-9]+).*[\'"].*>/i', $post->post_content, $matches );
|
|
23
|
+
$image_id = $matches[1][0];
|
|
24
|
+
if( !$image_id && $altimg_id ){
|
|
25
|
+
$image_id = $altimg_id;
|
|
26
|
+
}
|
|
27
|
+
$image = wp_get_attachment_image( $image_id, $get_size, false, array(
|
|
28
|
+
'class' => 'thumbnail-image',
|
|
29
|
+
'srcset' => wp_get_attachment_image_srcset( $image_id, $get_size ),
|
|
30
|
+
'sizes' => wp_get_attachment_image_sizes( $image_id, $get_size )
|
|
31
|
+
) );
|
|
32
|
+
if( empty($image) ) {
|
|
33
|
+
$image = '<img src="https://placehold.jp/cfcfcf/ffffff/150x150.png?text=NO%20IMAGE">'; /* 代替画像のアドレスを指定する */
|
|
34
|
+
}
|
|
35
|
+
return $image;
|
|
36
|
+
}
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
◆カテゴリー一覧の表示、アーカイブを一覧表示に変更
|
|
40
|
+
index.php全部書き換え↓
|
|
41
|
+
```php
|
|
8
42
|
<?php
|
|
9
43
|
/**
|
|
10
44
|
* The main template file
|
|
@@ -25,8 +59,10 @@
|
|
|
25
59
|
?>
|
|
26
60
|
|
|
27
61
|
<main id="site-content" role="main">
|
|
28
|
-
|
|
62
|
+
|
|
63
|
+
|
|
29
|
-
<
|
|
64
|
+
<div class="category_list"><!-- カテゴリ一覧の表示 ここから -->
|
|
65
|
+
<ul>
|
|
30
66
|
<?php
|
|
31
67
|
$cat_all = get_terms( "category", "fields=all&get=all&exclude_tree=12&exclude=11" );
|
|
32
68
|
foreach($cat_all as $value):
|
|
@@ -34,112 +70,169 @@
|
|
|
34
70
|
<li><a href="<?php echo get_category_link($value->term_id); ?>"><?php echo $value->name;?>(<?php echo $value->count;?>)</a></li>
|
|
35
71
|
<?php endforeach; ?>
|
|
36
72
|
</ul>
|
|
37
|
-
<!-- カテゴリ一覧の表示 ここまで -->
|
|
73
|
+
</div><!-- カテゴリ一覧の表示 ここまで -->
|
|
38
74
|
|
|
39
|
-
<!-- アイキャッチ画像一覧の表示 ここから -->
|
|
40
|
-
<div class="article-wrap">
|
|
41
|
-
<?php
|
|
42
75
|
|
|
43
|
-
|
|
76
|
+
<?php
|
|
44
|
-
$archive_subtitle = '';
|
|
45
77
|
|
|
78
|
+
$archive_title = '';
|
|
46
|
-
|
|
79
|
+
$archive_subtitle = '';
|
|
47
|
-
global $wp_query;
|
|
48
80
|
|
|
49
|
-
|
|
81
|
+
if ( is_search() ) {
|
|
50
|
-
|
|
82
|
+
global $wp_query;
|
|
51
|
-
'<span class="color-accent">' . __( 'Search:', 'twentytwenty' ) . '</span>',
|
|
52
|
-
'“' . get_search_query() . '”'
|
|
53
|
-
);
|
|
54
83
|
|
|
84
|
+
$archive_title = sprintf(
|
|
85
|
+
'%1$s %2$s',
|
|
86
|
+
'<span class="color-accent">' . __( 'Search:', 'twentytwenty' ) . '</span>',
|
|
87
|
+
'“' . get_search_query() . '”'
|
|
88
|
+
);
|
|
89
|
+
|
|
55
|
-
|
|
90
|
+
if ( $wp_query->found_posts ) {
|
|
56
|
-
|
|
91
|
+
$archive_subtitle = sprintf(
|
|
57
|
-
|
|
92
|
+
/* translators: %s: Number of search results. */
|
|
58
|
-
|
|
93
|
+
_n(
|
|
59
|
-
|
|
94
|
+
'We found %s result for your search.',
|
|
60
|
-
|
|
95
|
+
'We found %s results for your search.',
|
|
61
|
-
|
|
96
|
+
$wp_query->found_posts,
|
|
62
|
-
|
|
97
|
+
'twentytwenty'
|
|
63
|
-
|
|
98
|
+
),
|
|
64
|
-
|
|
99
|
+
number_format_i18n( $wp_query->found_posts )
|
|
65
|
-
|
|
100
|
+
);
|
|
66
|
-
|
|
101
|
+
} else {
|
|
67
|
-
|
|
102
|
+
$archive_subtitle = __( 'We could not find any results for your search. You can give it another try through the search form below.', 'twentytwenty' );
|
|
68
|
-
}
|
|
69
|
-
} elseif ( is_archive() && ! have_posts() ) {
|
|
70
|
-
$archive_title = __( 'Nothing Found', 'twentytwenty' );
|
|
71
|
-
} elseif ( ! is_home() ) {
|
|
72
|
-
$archive_title = get_the_archive_title();
|
|
73
|
-
$archive_subtitle = get_the_archive_description();
|
|
74
103
|
}
|
|
104
|
+
} elseif ( is_archive() && ! have_posts() ) {
|
|
105
|
+
$archive_title = __( 'Nothing Found', 'twentytwenty' );
|
|
106
|
+
} elseif ( ! is_home() ) {
|
|
107
|
+
$archive_title = get_the_archive_title();
|
|
108
|
+
$archive_subtitle = get_the_archive_description();
|
|
109
|
+
}
|
|
75
110
|
|
|
76
|
-
|
|
111
|
+
if ( $archive_title || $archive_subtitle ) {
|
|
77
|
-
|
|
112
|
+
?>
|
|
78
113
|
|
|
79
|
-
|
|
114
|
+
<header class="archive-header has-text-align-center header-footer-group">
|
|
80
115
|
|
|
81
|
-
|
|
116
|
+
<div class="archive-header-inner section-inner medium">
|
|
82
117
|
|
|
83
|
-
|
|
118
|
+
<?php if ( $archive_title ) { ?>
|
|
84
|
-
|
|
119
|
+
<h1 class="archive-title"><?php echo wp_kses_post( $archive_title ); ?></h1>
|
|
85
|
-
|
|
120
|
+
<?php } ?>
|
|
86
|
-
<?php
|
|
87
|
-
$thumbnail_id = get_post_thumbnail_id();//アイキャッチのID
|
|
88
|
-
$data = wp_get_attachment_image_src($thumbnail_id,'thumbnail');//配列
|
|
89
|
-
?>
|
|
90
|
-
<img src="<?php echo $data[0] ;?>" width="<?php echo $data[1] ;?>" height="<?php echo $data[2] ;?>" >
|
|
91
|
-
<?php if ( $archive_subtitle ) { ?>
|
|
92
|
-
<div class="archive-subtitle section-inner thin max-percentage intro-text"><?php echo wp_kses_post( wpautop( $archive_subtitle ) ); ?></div>
|
|
93
|
-
<?php } ?>
|
|
94
121
|
|
|
95
|
-
|
|
122
|
+
<?php if ( $archive_subtitle ) { ?>
|
|
123
|
+
<div class="archive-subtitle section-inner thin max-percentage intro-text"><?php echo wp_kses_post( wpautop( $archive_subtitle ) ); ?></div>
|
|
124
|
+
<?php } ?>
|
|
96
125
|
|
|
126
|
+
</div><!-- .archive-header-inner -->
|
|
127
|
+
|
|
97
|
-
|
|
128
|
+
</header><!-- .archive-header -->
|
|
98
|
-
|
|
129
|
+
|
|
99
|
-
|
|
130
|
+
<?php
|
|
100
|
-
|
|
131
|
+
}
|
|
101
|
-
|
|
132
|
+
|
|
102
|
-
|
|
133
|
+
if ( have_posts() ) {
|
|
103
|
-
|
|
134
|
+
if ( is_archive() ) {
|
|
104
|
-
|
|
135
|
+
?>
|
|
105
|
-
|
|
136
|
+
<div class="ex-list">
|
|
137
|
+
<?php
|
|
106
|
-
|
|
138
|
+
while ( have_posts() ) {
|
|
139
|
+
the_post();
|
|
107
|
-
|
|
140
|
+
?>
|
|
108
|
-
|
|
141
|
+
<div>
|
|
142
|
+
<a href="<?php the_permalink(); ?>">
|
|
109
|
-
|
|
143
|
+
<?php $catch_thumbnail_size = 'thumbnail'; if(has_post_thumbnail()){ the_post_thumbnail($catch_thumbnail_size); } else { echo catch_thumbnail_image($catch_thumbnail_size); } ?>
|
|
144
|
+
<?php the_title(); ?>
|
|
145
|
+
</a>
|
|
146
|
+
</div>
|
|
147
|
+
<?php
|
|
110
148
|
}
|
|
149
|
+
?>
|
|
150
|
+
</div><!-- end of .category-list -->
|
|
151
|
+
<?php
|
|
152
|
+
}else{
|
|
111
153
|
|
|
112
|
-
|
|
154
|
+
$i = 0;
|
|
113
155
|
|
|
114
|
-
|
|
156
|
+
while ( have_posts() ) {
|
|
115
157
|
|
|
116
|
-
}
|
|
117
|
-
} elseif ( is_search() ) {
|
|
118
|
-
?>
|
|
119
158
|
|
|
159
|
+
$i++;
|
|
160
|
+
if ( $i > 1 ) {
|
|
120
|
-
<
|
|
161
|
+
echo '<hr class="post-separator styled-separator is-style-wide section-inner" aria-hidden="true" />';
|
|
162
|
+
}
|
|
163
|
+
the_post();
|
|
121
164
|
|
|
122
|
-
<?php
|
|
123
|
-
get_search_form(
|
|
124
|
-
array(
|
|
125
|
-
|
|
165
|
+
get_template_part( 'template-parts/content', get_post_type() );
|
|
126
|
-
)
|
|
127
|
-
);
|
|
128
|
-
?>
|
|
129
166
|
|
|
130
|
-
|
|
167
|
+
}
|
|
131
168
|
|
|
132
|
-
<?php
|
|
133
|
-
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
} elseif ( is_search() ) {
|
|
134
172
|
?>
|
|
135
173
|
|
|
136
|
-
<
|
|
174
|
+
<div class="no-search-results-form section-inner thin">
|
|
137
175
|
|
|
176
|
+
<?php
|
|
177
|
+
get_search_form(
|
|
178
|
+
array(
|
|
179
|
+
'label' => __( 'search again', 'twentytwenty' ),
|
|
180
|
+
)
|
|
181
|
+
);
|
|
182
|
+
?>
|
|
183
|
+
|
|
184
|
+
</div><!-- .no-search-results -->
|
|
185
|
+
|
|
186
|
+
<?php
|
|
187
|
+
}
|
|
188
|
+
?>
|
|
189
|
+
|
|
190
|
+
<?php get_template_part( 'template-parts/pagination' ); ?>
|
|
191
|
+
|
|
138
192
|
</main><!-- #site-content -->
|
|
139
|
-
</div><!-- /.article-wrap -->
|
|
140
193
|
|
|
141
194
|
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
|
|
142
195
|
|
|
143
196
|
<?php
|
|
144
197
|
get_footer();
|
|
198
|
+
|
|
145
|
-
```
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
◆見た目の調整
|
|
202
|
+
[外観]-[カスタマイズ]-[追加CSS]に追記↓
|
|
203
|
+
flexbox使用。横幅700px以上で横4つ、それより小さい場合は横2つ
|
|
204
|
+
```css
|
|
205
|
+
.category_list{
|
|
206
|
+
padding:4rem 0 0;
|
|
207
|
+
max-width: 58rem;
|
|
208
|
+
width: calc(100% - 4rem);
|
|
209
|
+
margin-left: auto;
|
|
210
|
+
margin-right: auto;
|
|
211
|
+
}
|
|
212
|
+
.ex-list{
|
|
213
|
+
display:flex;
|
|
214
|
+
flex-wrap: wrap;
|
|
215
|
+
width: calc(100% - 4rem);
|
|
216
|
+
padding:4rem 0 0;
|
|
217
|
+
max-width: 58rem;
|
|
218
|
+
width: calc(100% - 4rem);
|
|
219
|
+
margin-left: auto;
|
|
220
|
+
margin-right: auto;
|
|
221
|
+
}
|
|
222
|
+
.ex-list>div{
|
|
223
|
+
width:50%;
|
|
224
|
+
padding: .5em;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
@media (min-width: 700px){
|
|
228
|
+
.ex-list{
|
|
229
|
+
padding:8rem 0 0;
|
|
230
|
+
}
|
|
231
|
+
.ex-list>div{
|
|
232
|
+
width:25%;
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
```
|
|
236
|
+
|
|
237
|
+
それっぽくはなると思いますが細かいところは調整してません。
|
|
238
|
+
見落としがあるかもしれないので後でもう一度見直します。
|