デモページ：投稿している画像の一枚目をアイキャッチがわりにサムネイルとして表示したい

2022.6.15

ブログをリニューアルしようと思う
なんだか、もっとトップをそれっぽくしたものにしたい。「ホームページ作る仕事してる」って人に話したら、「ページないの？」と聞かれることがある。が、しかし、うん、これただのブログやし・・・教えたところで、ブログやし・・・ […]

2022.5.31

[WP] 外部ドメインの更新情報を新着として表示させたい（RSS利用・複数ブログ対応）

複数ブログを運営しているなどの理由で、外部ドメインの新着をまとめて表示したい場合の方法です。 HTMLとphp

<?php include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed(array(
'URLその１',
'URLその２',
'URLその３'
));
if (!is_wp_error( $rss ) ) : 
    $rss->set_cache_duration(1800);//★キャッシュクリア
    $rss->init();
    $maxitems = $rss->get_item_quantity(10); //表示する件数調整
    $rss_items = $rss->get_items(0, $maxitems);
    date_default_timezone_set('Asia/Tokyo');//データゾーンを日本に
endif;
?>
<ul>
    <?php 
    foreach ( $rss_items as $item ) : ?>

						
						<li><?php echo $item->get_date('Y.m.d'); ?>：<!--日付--><br>
[<?php echo $item->get_feed()->get_title(); ?>]：<!--複数読み込む場合はサイト名あったほうが良いかと--><br>
<a href='<?php echo $item->get_permalink(); ?>' target="_blank"><?php echo $item->get_title(); ?></a><!--記事タイトル：リンク付き--></li>
<?php endforeach; ?>
</ul>

<?php include_once(ABSPATH . WPINC . '/feed.php');

$rss = fetch_feed(array(

'URLその１',

'URLその２',

'URLその３'

));

if (!is_wp_error( $rss ) ) :

$rss->set_cache_duration(1800);//★キャッシュクリア

$rss->init();

$maxitems = $rss->get_item_quantity(10); //表示する件数調整

$rss_items = $rss->get_items(0, $maxitems);

date_default_timezone_set('Asia/Tokyo');//データゾーンを日本に

endif;

<ul>

<?php

foreach ( $rss_items as $item ) : ?>

[<?php echo $item->get_feed()->get_title(); ?>]：<br>

<a href='<?php echo $item->get_permalink(); ?>' target="_blank"><?php echo $item->get_title(); ?></a></li>

<?php endforeach; ?>

</ul>

RSSの更新時間を早めるには RSSは更新 […]

2022.3.30

[jQuery]スクロールして、要素が現れたら、固定（fix表示）になるみたいなやつ（offset()とscrollTop()比較）
よくヘッダーとかでも見るアレです。スクロールして、それが表示されたらヘッダーに固定される！みたいな。説明が難しいのでデモページ。 HTML

<div id="wrapper"> <div class="box1"> ここはヘッダーです！ </div> </div>

1
2
3

<div id="wrapper">
<div class="box1"> ここはヘッダーです！ </div>
</div>

CSS [c […]
2022.3.12

[CSS]属性セレクター
属性セレクター、すごく便利なのでとってもよく使うのですが、その割になんやったっけ？って忘れるので、忘れっぽい自分のためにも整理しようと思います。うまくまとめる自信がないので、いろんな例を上げる形で。 p[title]{ […]
2022.3.10

SVGファイルが伸び縮みしない（拡大縮小出来ない）時
SVGファイル、伸ばしても画像が荒れないので、とても便利ですよね。でも、これうっかりイラレとかで上書きして保存して、そのまま使おうとしたら・・・ 100%にしてるのに、全然伸びない。伸び縮みしないですやん・・・・ええ […]
2022.2.14

[CSS]スクロールバーが２本出てしまう時
とってもアナログなアイキャッチですみません・・・。タイトルの通りなのですが、なぜかスクロールバーが２本出てきて、スクロールが少しもたつくような時ありませんか？私はあります。ある部分だけスクロールバーが２本出現するこ […]
2021.2.16

dreamweaverのコードビューの文字色とか大きさがめちゃくちゃになった時の対処
突然ですが、アイキャッチのようにコードヒントがイキナリ潰れたかのようになりまして。でも、もう面倒なのでそのまま作業を進めているも、だんだんイライラしてきたので環境設定から色々いじったら、黒背景に黒文字というわけのわから […]
2020.8.25

[css]display:grid;@gridレイアウトーその３：【grid-template-areas】ー
直感的にわかりやすい、2次元レイアウトのグリッドレイアウト。かなり奥が深くて、私自身まだかなり手探りなのですが、ちょっとずつ自分の学習のためにもまとめてみようと思います。そんな中でも、特に直感的に配置できるgrid- […]
2020.8.19

[css]display:grid;@gridレイアウトーその２ー
直感的にわかりやすい、2次元レイアウトのグリッドレイアウト。かなり奥が深くて、私自身まだかなり手探りなのですが、ちょっとずつ自分の学習のためにもまとめてみようと思います。
2020.8.15

[css]display:grid;@gridレイアウトをざっくりまとめるーその１：基本ー
直感的にわかりやすい、2次元レイアウトのグリッドレイアウト。かなり奥が深くて、私自身まだかなり手探りなのですが、ちょっとずつ自分の学習のためにもまとめてみようと思います。
2020.8.1

animationアニメーション仕組み
animationスタイルはtransitionよりも少し細かい動きの設定ができます。 transitionは最初と最後のスタイルの設定だけですが、animationだと間の動きにもスタイルを入れることができるので、より […]
2020.6.16

[css]transitionアニメーションまとめ
transitionアニメーションについてまとめました！ちょっとしたボタンのマウスオーバーなど、簡単な部分に使うことも多く、すぐに忘れてしまうので、コピペできるように（備忘）。
2020.6.6

【プラグイン】Search & Filterを使って、タグやカテゴリーやタクソノミーの絞り込み検索をする方法
サイドにチェックボックスをつけて絞り込み検索機能をつけてるサイトはたくさんあると思います。あれを一から構築するとすごく大変ですが、プラグインを使えばとっても簡単！！１：プラグイン「Search & Filt […]

2020.4.23

アコーディオンメニューに別ページからアンカーリンクで飛んだ時に開いた状態にする

めっちゃタイトル長くなりました、なんて表現したらいいかわからず。そのままの事例です。この時の記事と同じアコーディオンの場合という前提で。 HTML

<ul>
  <li> <a class="parent">親要素１</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
  <li> <a class="parent" id="test">アンカーリンク開くかテスト</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
  <li> <a class="parent">親要素３</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
</ul>

<ul>

</ul>

</li>

<li> <a class="parent" id="test">アンカーリンク開くかテスト</a>

</ul>

</li>

</ul>

</li>

</ul>

CS […]

2020.4.18

画像のマスク風スライドエフェクト
最近とてもよく見る気がするのですが、この表現方法、エフェクトの名前なんて言うのかわかりません。マスクっぽいのが画像の上をスライドして、画像が見えてくるエフェクトです。やり方どうするのかわからなくて試行錯誤して、なんとなく […]
2020.4.6

スライドショー：時間差で要素を出す方法（slick使用）
これは説明するよりもDEMOを見ていただいた方がわかりやすいと思うので早速DEMOです。 DEMO ：　https://chakoiro.net/demo/slick/slide_test.html こちら説明するまでも […]
2020.3.20

[WPプラグイン]WordPressテーマのテストをする時に便利「WP Theme Test」：ログイン中だけテストテーマを当てる
複雑なことをしなくても、ログイン中だけ、テストテーマを試せる。。。という、とても楽チンで便利なプラグインです！テーマのちょっとした改造などでテストしたい時など、おすすめです。

2020.3.16

アコーディオンっぽいメニューを簡単に実装（自分以外のアコーディオンは閉じる）

縦でも横でも、アコーディオンなメニューの要望はとても多いので、いつも自分が使うやり方をまとめました。 HTML

<ul>
  <li> <a class="parent">親要素１</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
  <li> <a class="parent">親要素２</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
  <li> <a class="parent">親要素３</a>
    <ul class="child">
      <li><a href="">子要素１</a></li>
      <li><a href="">子要素２</a></li>
      <li><a href="">子要素３</a></li>
    </ul>
  </li>
</ul>

<ul>

</ul>

</li>

</ul>

</li>

</ul>

</li>

</ul>

Javascript [crayon-62 […]

2019.12.13

[CSS]flex container・flex itemのプロパティ一覧：まとめ
自分がよく使うflex containerのプロパティをまとめました。全然覚えられないので（私だけ？）まとめておくと自分が楽なので・・・
2019.8.31

Basic認証ざっくり設定備忘
Basic認証、今更ですがまとめます。難しいことはちょっと抜きにして、ざっくり設定方法のみです。
2019.8.21

[WordPress]WPで画像表示のエラー：管理画面では画像表示されるのに公開するとリンク切れになったときに対処した方法
タイトル長くなったのですが・・・管理画面では大丈夫なのに、公開してるWPを見ると画像がリンク切れ・・・画像を表示させて見ると「We cannot complete this request, remote data […]
2019.8.20

bxsliderのナビ（ページャー）のリンクが機能しない時の対処法
bxsliderとても便利で、一番使ってるスライダーなのですが、先日、chromeとsafariで、ページャーのリンクが機能しなくなってしまいました。・・・だいぶ焦った・・・でも、対処できましたので、その時の対処法を […]
2019.4.23

【wordpress 】カテゴリー一覧・最近の投稿など、ウィジェットなしで出す場合
本当に基本的なブログのサイドなどにありがちな、カテゴリー一覧とか最近の投稿や月別アーカイブなど・・・こう言ったのはウィジェット使わなくても簡単に出せるのです。自分がよく使うので、自分のコピペ用みたいな記事です・・・おいお […]
2019.2.15

[css]スマホで余白が出来て横スクロールが出るときのチェックポイントとスマホの横スクロールの消し方
スマホで見ると、身に覚えのない余白が右側にできて、それゆえ横スクロールが出てしまって、画面が揺れまくると言う現象は・・・あるあるですね。いや、あってはいけないのですが！そう言うとき、さくっと解決対処法です。注意こ […]
2019.1.3

[WPプラグイン]Biz Calendar：簡単で使いやすいカレンダープラグインです
カレンダープラグインは色々あると思うのですが、今回使ってみたBiz Calendarがわかりやすくて良かったです。
2018.11.13

[WPプラグイン]Breadcrumb NavXT：WPでパンくずリストを作ろう
WPにパンくずリストをつけようと思うと。。。結構大変ですよね。 phpとか、結構がっつり書かないとダメです。検索したらいっぱい出てきますが、それでもやはりある程度のphpの知識がないと辛いですよね。私はそこまでまだp […]
2018.11.11

[WordPress]日本語入力できない！投稿すると文字化けする！ってなったとき
私、こんなケース初めてで、対処法として正しいかわかりませんが・・これで解決したので、一応記録しておきます。完全備忘です。
2018.11.4

[DreamWeaver]コードの整理をする＠ソースフォーマットの適用
私だけかもしれませんが。。。コードを書いてるうちに、インデントが崩れてきたり、なんやかんや、汚いコードになります・・・そんな時パッと整形してくれるDWのソースフォーマット適用について。
2018.10.25

[WordPress]options.phpでメディア設定を変える方法
メディアを追加するときって、デフォルトの形が決まっていますよね。それをいちいち都度チェックして設定し直すのは、手間になるってときに、、、 Codexhttp://wpdocs.osdn.jp/%E3%82%AA%E3%8 […]
2018.10.4

[WordPress]アイキャッチの代わりに画像の一枚目を自動でサムネイルにする方法
一覧画面とか新着一覧とかでもサムネイルで表示できるアイキャッチ、これはとても便利ですし、よく使う機能だと思うのですが、「アイキャッチ、登録するの忘れるから、記事内の画像をサムネイルとして出すことできない？」というご意見を […]
2018.10.4

[WordPress]全カテゴリの全記事を一覧で表示させる方法（カテゴリ別記事一覧）
なぜかすごい文字化けしていたので一旦非表示にしてます、近日公開。
2018.9.26

[CSS]スタイルシートでフォントに縁取りをしたい
画像を使わずに、スタイルシートで文字に縁取りをしたい・・・という時のために。
2018.9.6

[WordPress]トップ以外で全カテゴリの投稿一覧の出し方
全カテゴリーを含んだ投稿一覧を作る方法です。普通にしたらトップページがそれに当たるわけですが、トップページが固定ページで固定のデザインを表示させたり、いろいろ事情があってトップを普通にブログ的な投稿一覧にできないことは […]
2018.9.4

[WordPress]php wp_title();のタイトル取得で入る変なスペース対処
記事のタイトルを取得してtitleに入れたり、h1に入れたりっていうのはWPを構築するときに基本として必要になってくる事項かと思います。
2018.9.4

[WordPress]ビジュアルリッチエディタが表示されない不具合
管理画面より新規追加を押してびっくり、ビジュアルリッチエディタが表示されなくて、戸惑ったことがありました。その時の対処法についてです。
2018.8.29

[WPプラグイン]【Search Regex】WP内の一括置換が簡単にできる
最近SSL化に関する仕事も多くあり、このアクセスあるかないかっていう弱小サイトもつい先日SSL化しました（遅！）。 SSL化そんなに難しいことはないのですが、全部httpsに書き換えないといけないこととか、WPが絡んでく […]
2018.5.21

[CSS]CSSで変数を使おう
CSSで変数が使えたら、とても便利です。わかりやすい例えで言うと、背景色とか、アクセントカラーとか一気に変えられる！！ブラウザ状況的にまだ微妙なものもあるみたいですが、簡単な範囲でまとめてみます。
2018.5.20

[CSS]リストの頭を簡単に揃える方法
リストって１行で終わるものであれば、そんなに悩むことはないのですが、２行以上になると・・・頭が揃わないことありませんか？普通に「・」だけでいけるなら、list-style-typeで解決するので、２行目以降も頭揃える […]
2018.3.11

[CSS]蛍光ペンやマーカーで線を引いたようなラインを実装もできる「linear-gradient」とは
蛍光ペンで強調させるようなこういったスタイルをよく見かけます。これは「linear-gradient」というスタイルで実装されているのですが、私もなんとなく使っており、本当の意味を理解していないところもあったので、 […]
2018.3.5

[WoprdPress]【php comments_link();】WordPressのアーカイブ一覧から、その記事のコメント欄へリンクさせるテンプレートタグ
WPの各投稿にコメント数を入れて、コメントに直接リンクするという仕様をよく使うので、備忘的に記録します。
2018.1.7

[WordPress]静的なhtmlのページに同じサーバー内のWPの更新情報を表示させる方法
ページ全体はhtmlで作られていますが、ある一部分だけ、お知らせとか新着とか、そういうのだけWordPressで作りたいというのは、最近とてもよくある要望です。いくらか方法はあると思うのですが、今回は一番私がよく使ってい […]
2018.1.5

[WoredPress]WordPressのカテゴリ一覧をドロップダウン表示させる方法
ウィジェットを使えば簡単にカテゴリ一覧の表示は可能ですが、時と場合によってはウィジェットを使うほどではない時も多々あるかと思います。できるだけ省スペースでしたい時なんかはドロップダウンを使ってのカテゴリ検索は本当に便利 […]
2017.12.27

[WPプラグイン]WoredPressに写真をアップしたらなぜか縦横が変わる件について
特に加工することなく、スマホなんかで撮影した写真をそのままWPにアップしたら、縦長の画像が勝手に回転されてしまう現象が起きました。顔を横に向けて見ろと言うのか？！っていう現象ですね。それは困る。ということで調べてみた […]
2017.12.10

[WPプラグイン]Attendance Manager ー出勤管理・シフト管理・勤怠管理プラグイン
初めて使ってみてその多機能さというか、プラグインでこんなことまでできるのかと驚いたプラグインだったので、簡単に記録しておきます。へぼへぼの私には衝撃的だったのです。その名も、「Attendance Manager」 […]
2017.12.1

[WPプラグイン]カウンタープラグイン「Count per Day」「WP-PostViews」を使って見た
今回アクセスカウンター系のプラグインを色々調べて見ました。実際に入れてみたものについて簡単に。
2017.11.24

[CSS]メディアクエリ　〜簡単に自分的まとめ〜
昔はスマホなどがなかったので、PCか携帯か・・・くらいのもんでしたが、今となってはタブレットもスマホもあり、それこそデバイスのサイズによってレイアウトを変えるのが当たり前のレスポンシブ時代になりました。以前はこの程度の […]
2017.11.20

[WordPress]WordPressカスタム投稿の管理画面の記事一覧の並び順を日付順に
なぜかわかりませんが、カスタム投稿の管理画面の記事一覧って公開日時順になってないという状況に遭遇しました。ググりまくって調べたら色々やり方はありまして。その中で簡単にできたものを、こちらにても掲載させていただきました。 […]
2017.11.19

[CSS]擬似クラス擬似要素：まとめ
擬似クラスとてもよく使うので、備忘的にまとめます。
2017.11.18

[WordPress]WordPressの管理画面のメニューのカスタマイズ（非表示・表示名変更）
WPとっても便利ですが、慣れてないクライアントの方が初めて使う場合、左側の管理メニュー見ても「？！」ってなることもあるでしょうし、そのメニューの名称がとっつきにくいとか、そのメニュー自体を表示させない方がいいとか、ユーザ […]
2017.10.20

[WordPress]：基本的なカスタム投稿タイプの設定と一覧の出力まで
カスタム投稿、今一度自分なりの基本的な流れをざっくり簡潔に、、、ですが書いてみようと思います。
2017.7.21

[プラグイン]クリッカブルマップをレスポンシブサイトにも適用させたいなら「jQuery RWD Image Maps」
使う機会はすごく減って来た気はするのですが、やはりたまに必要なクリッカブルマップ。レスポンシブ対応のサイトだと、スマホから見ると、マップの位置というか座標がぐぐっとずれて、全然ダメなんですよね・・・そんな時に便利すぎ […]
2017.7.19

[WPプラグイン]テーブル内のデータを検索できる機能「QuickSearch」プラグイン
テーブルやリストからデータを検索できる便利なプラグイン「QuickSearch」について。以前数回使ったことはあったのですが、ここしばらく使う機会がなく、久々に最近使ったので備忘的に。とっても便利で気持ちよい動きのプラ […]