いん | Be Yourself

ワードプレスのテーブルwp_postsデータを取ってきてLaravelで表示.

2025.07.15

おはようございます.ワードプレスのテーブル（wp_posts）データを取ってきて別サイト（Laravel）にて表示してます.別サイトには広告が付かない感じです.因みにデータは自サイトのブログデータを使用していますが随時去年あたりのデータから取得するようにSQLに記述しています.

尚、どうやって取得しているかをお話するとSQLのコネクション変更する設定をコンフィグフォルダのデータベースファイルに記述してモデルにもその事を明記しています.

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;


class Blog extends Model
{
    protected $connection = 'second_db';
    protected $table = 'wp_posts';
}

そしてそれらを呼び出しているだけです、とても簡単なコードで動いています.そんな感じなのでブレイドのコードをシェアします、流石にコントローラーは見せられないけどYoutubeのリンクやXのリンクは出力する前に置き換えていることをヒントとしてお伝えしときますね.

<!doctype html>
<html lang="ja" class="transition-colors duration-300">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
    <meta name="robots" content="noindex,nofollow" />
    <title>blog - [taoka toshiaki]</title>
    <link rel="icon" href="https://taoka-toshiaki.com/images/g4DV7mRe_400x400.jpg?t=1752317617"
        sizes="16x16 24x24 32x32 48x48 64x64">
    <!-- Prism CSS -->
    <link id="prism-theme" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1/themes/prism.css" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1/plugins/line-numbers/prism-line-numbers.css" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/toolbar/prism-toolbar.min.css"
        rel="stylesheet" />
    <style>
        body {
            background-color: #f9fafb;
            color: #1f2937;
            transition: background-color 0.3s, color 0.3s;
            word-wrap: break-word;
            overflow-wrap: break-word;
        }

        .dark body {
            background-color: #242425;
            color: #f9fafb;
        }

        article {
            background-color: #fff;
            transition: background-color 0.3s;
            word-wrap: break-word;
            overflow-wrap: break-word;
        }

        .dark article {
            background-color: #3d3d47;
        }

        time {
            color: #6b7280;
        }

        .dark time {
            color: #9ca3af;
        }

        .prose {
            color: inherit;
            word-wrap: break-word;
            overflow-wrap: break-word;
        }

        pre[class*="language-"] {
            overflow-x: auto;
            padding: 1em;
            border-radius: 0.5rem;
        }

        code[class*="language-"] {
            white-space: pre;
        }

        a,
        a:hover {
            border-bottom: solid 2px #fbf81c;
        }
    </style>
    @include('header_script')
</head>

<body class="transition-colors duration-300">

    <div class="max-w-3xl mx-auto p-6">
        <h1 class="text-2xl font-bold mb-6"><a href="/" class="text-current">🏠️Top Page</a></h1>
        <p class="mb-3 font-bold"><a href="/blog">🖊️</a>おもしろき こともなき世をおもしろく 住みなすものは 心なりけり.</p>
        @if (request()->input('page') == 108)
            <a href="/blog" class="text-[54px]">📖</a>
            <h1 class="text-2xl font-bold text-[108px] mb-6">108🧘️</h1>
        @endif

        <button id="darkModeToggle"
            class="mb-6 px-4 py-2 bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 rounded">
            ダークモード切り替え
        </button>

        <div class="space-y-10">
            @foreach ($items as $item)
                <article class="shadow-md rounded-lg p-6 transition-colors duration-300">
                    <h2 class="text-xl font-semibold mb-2 break-words">⏩️{{ $item->post_title }}</h2>
                    <time class="text-sm block mb-4">{{ $item->post_date }}</time>
                    <div class="prose prose-sm max-w-none break-words">
                        {!! $item->post_content !!}
                    </div>
                </article>
            @endforeach
        </div>

        <div class="mt-10">
            {{ $items->links() }}
        </div>
    </div>
    <!-- トップに戻るボタン -->
    <button id="scrollTopBtn"
        class="fixed bottom-6 right-6 hidden bg-gray-600 text-white px-4 py-2 rounded-full shadow-lg hover:bg-gray-700 transition-opacity">
        ▲ 上へ戻る
    </button>
    <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    <script src="https://cdn.jsdelivr.net/clipboard.js/1.5.13/clipboard.min.js"></script>
    <!-- Prism.jsのコアファイル -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
    <!-- Prism.jsのオートローダ -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
    <!-- Toolbarプラグインのスクリプト -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/toolbar/prism-toolbar.min.js"></script>
    <!-- その他のプラグインのスクリプト -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/highlight-keywords/prism-highlight-keywords.min.js"></script>

    <script>
        const toggleBtn = document.getElementById('darkModeToggle');
        const prismTheme = document.getElementById('prism-theme');
        const darkThemeHref = 'https://cdn.jsdelivr.net/npm/prismjs@1/themes/prism-tomorrow.css';
        const lightThemeHref = 'https://cdn.jsdelivr.net/npm/prismjs@1/themes/prism.css';

        if (localStorage.getItem('darkMode') === 'true') {
            document.documentElement.classList.add('dark');
            prismTheme.href = darkThemeHref;
        }

        toggleBtn.addEventListener('click', () => {
            const isDark = document.documentElement.classList.toggle('dark');
            prismTheme.href = isDark ? darkThemeHref : lightThemeHref;
            localStorage.setItem('darkMode', isDark);
        });

        document.addEventListener("DOMContentLoaded", () => {
            document.querySelectorAll('pre[class*="lang-"]').forEach(pre => {
                const match = pre.className.match(/lang-(\w+)/);
                if (match) {
                    const lang = match[1];
                    pre.className = `language-${lang} line-numbers`;
                    const code = pre.querySelector('code');
                    if (code) code.className = `language-${lang}`;
                }
            });
            // トップへ戻るボタンの処理
            const scrollTopBtn = document.getElementById("scrollTopBtn");
            window.addEventListener("scroll", () => {
                scrollTopBtn.classList.toggle("hidden", window.scrollY < 200);
            });

            scrollTopBtn.addEventListener("click", () => {
                window.scrollTo({
                    top: 0,
                    behavior: "smooth"
                });
            });
        });

        //全選択ボタンを作成＆クラス名付与
        Prism.plugins.toolbar.registerButton('select-code', function(env) {
            var newButton = document.createElement('button');
            newButton.className = 'code-select-btn';
            newButton.innerHTML = 'コードを選択';

            newButton.addEventListener('click', function() {
                if (document.body.createTextRange) { // ms
                    var range = document.body.createTextRange();
                    range.moveToElementText(env.element);
                    range.select();
                } else if (window.getSelection) { // moz, opera, webkit
                    var selection = window.getSelection();
                    var range = document.createRange();
                    range.selectNodeContents(env.element);
                    selection.removeAllRanges();
                    selection.addRange(range);
                }
            });
            return newButton;
        });

        //使用言語表示ボタンを作成＆クラス名付与
        Prism.plugins.toolbar.registerButton('show-lang-btn', function(env) {
            var newButton2 = document.createElement('button');
            newButton2.className = 'show-lang-btn';
            newButton2.innerHTML = env.language;
            return newButton2;
        });

        $(function() {
            //各ボタン要素の親要素にクラス名付与
            $('.toolbar-item .code-select-btn').parents('.toolbar-item').addClass('code-select');
        });
    </script>

</body>

</html>

明日へ続く

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

投稿日時 2025年07月15 07:00日

タグ

```, ;;⏩, あたり, いん, オート, お伝え, お話, クラス, コード, コア, こと, コネクション, コントローラー, コンフィグフォルダ, サイト, シェア, スクリプト, その他, それら, ダーク, データ, データベース, テーブル, ドップ, ヒント, ファイル, フラグ, ブレイド, プレス, ブログデータ, ボタン, モード, モデル, もの, よう, リンク, ローダ, ワード, 付与, 作成, 使用, 処理, 出力, 切り替え, 去年, 取得, 変更, 広告, 感じ, 明日, 明記, 流石, 簡単, 表示, 要素, 言語, 記述, 設定, 選択, 随時,

思ったことを綴って小銭が毎日入るのは良いけど、小銭止まり.

2025.06.20

Logging

おはようございます.思ったことを綴って小銭が毎日入るのは良いけど毎日小銭止まりです.小銭がどれぐらいかといえばお賽銭にいれる小銭が毎日入ってくると思ってください.それが毎日入ってきて？札になる感じですが収入が銀行に毎月振り込まれるわけでもないです.

一年前？は毎月振り込まれる感じでしたが、いまは数ヶ月に一回ぐらいにペースが落ちました.でも収入が毎月コンスタントに数千円入るひともあまりいないようです.ほとんどの人は数百円止まりだそうです.

一年前と今と同じことをしているので広告収入も上がらないだと思います.多少SEO改善はしているのですが、そもそもAI時代にSEOは無意味になりつつある気がしていて自分もSNSに結構、力を入れないといけないなって思っています.

SNSと相性が良いのがいま流行っているものを記事にして発信するときです、これは相性が良いです.自分が作った推し記事をSNSへ投稿できるプラグインからのアクセス数は増えていく一方で検索からのアクセス数は徐々にだけど減少傾向にあります.

これからはSEOよりもSNSへの発信を強固にして行くほうが堅実性があるように思えてなりません.

明日へ続く

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2025年06月20 07:00日

タグ

アクセス, いま, いん, ヶ月, こと, これ, コンスタント, それ, とき, どれ, ひと, フラグ, ベース, ほう, もの, よう, わけ, 一方, 傾向, 収入, 堅実, 小銭, 広告, 強固, 感じ, 投稿, 改善, 明日, 時代, 検索, 毎日, 毎月, 減少, 無意味, 発信, 相性, 自分, 記事, 賽銭, 銀行,

Picture-in-Pictureっていう拡張機能が良いです😍

2022.09.03

Logging

こんにちは、収益化が出来ても収入が少なかったらやっぱ悩ましいものですね。

今日はPicture-in-Pictureっていうグーグル公式が開発したChromeの拡張（Edgeでも似たような物があります）。ピクチャー・イン・ピクチャー（拡張）はYOUTUBEの他にネットフリックス、アマゾン・プライムなどもピクチャ・イン・ピクチャに対応していてとても良いです。

映画を観ながら、ネットサーフィンは勿論のこと、プログラムコード（他のアプリ起動）もながら書くことが出来てしまいます。YOUTUBEは右クリック＊２回でピクチャー・イン・ピクチャーになることは知っていましたが、この拡張を使用すると拡張のアイコン・ボタンを押すか、ALT+Pでその機能を使用することが出来ます。

今まで公式が出してきた拡張機能の中でダントツ良いですねぇ～。本当に快適です。

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2022年09月03 01:41日

タグ

2, ALT, Chrome, com, edge, https, LxCw-vvmIiI, Picture-in-Picture, watch, www, youtube, アイコン, アプリ, アマゾン, いん, グーグル, クリック, コード, こと, サーフィン, ダント, ネット, ネットフリックス, ピクチャ, ピクチャー, プライム, プログラム, ボタン, もの, 中, 今日, 他, 使用, 公式, 収入, 収益, 右, 対応, 拡張, 映画, 機能, 物, 起動, 開発,

sonyの🔗LinkBuds sを購入しましたのでレビュー。

2022.07.18

Logging

こんにちは、数日前にsonyの🔗LinkBuds sを購入しましたのでレビュー記事を残しときます。

SONYのLlinkBuds sが届く! pic.twitter.com/ERXv0nXLw1
— 田岡寿章@taoka_toshiaki🦌 (@taoka_toshiaki) July 16, 2022

まずは音質かと思いますが音質は思ったよりも良いですね。自分はwh-1000xm4も持っているのですが、素人には悪くない音質感を感じます。まぁでもwh-1000xm4の方が重低音は半端ないですけどね。それに比べると劣りはするものの、全然不満のないレベルです。コンパクトなのにこのレベルの音が出るのは良いじゃないかなお得感はありますよね。

https://www.youtube.com/watch?v=uVFtzb43T_0

歩いてながら視聴はある程度、音を高くすることでゴワゴワ感は感じなくなります。ただ、走ったりするとゴワゴワ感を感じるので、やはりスポーツする人には骨伝導やインイヤーイヤホンの方が断然良いという印象でした。

自分もスポーツする時にも使用したいなって思っていましたが、そこは他のイヤホンでカバーします。

まとめ：普段使いにはとても良いお買い物をしたなって思えました。買ってよかったです！

あっノイズキャンセリング機能などは普通に良いレベルです😌。

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2022年07月18 01:06日

タグ

1000, 4, linkbuds, SONY, wh-, xM, イヤー, イヤホン, いん, えま, お得感, お買い物, カバー, こと, コンパクト, スポーツ, そこ, それ, まとめ, レビュー, レベル, 不満, 人, 他, 使用, 半端, 印象, 思, 感, 数日, 方, 時, 普段, 素人, 自分, 視聴, 記事, 購入, 重低音, 音, 音質, 骨伝導,

airpodとsonyのlinkbudsどちら買おうかと思案してます。

2022.03.30

Logging

おはよう御座います☀。日の出も徐々に早くなってきてますね。

ipodとsonyのlinkbudsどちら買おうかと思案してます。airpodとの良いところはインイヤー型のイヤホンって所なんですね。自分は耳の中までフィット感のあるのは、ちょっとゴワゴワ感が感じるので無理なんですね、、なんでインイヤー型のイヤホンをいつも選択しています。

linkbudsは外部の音も物理的に取り入れているところが売りのイヤホンです、こちらもインイヤー型のイヤホンです。

書いていて分かったのですが、airpodを買います。理由は旅先で使うときに外部音はいらないので・・・。そういう事を考えるとairpodが良いかなって思います。本当はインイヤーのairpod proがあればそちらを購入していると思います。

https://www.youtube.com/watch?v=-5y2YqrlOr4

そう思うとairpodにノイズキャンセリング機能がつくまで待つのも良いかなって、それまでは保留にしておくのも良いかもしれないな。

それが今の心の声です。

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2022年03月30 04:58日

タグ

2, 4, 5, airpod, com, https, ipod, linkbuds, Pro, SONY, watch, www, youtube, YqrlOr, イヤー, イヤホン, いん, こちら, そちら, とき, ところ, どちら, フィット, 中, 事, 売り, 外部, 思, 思案, 感, 所, 旅先, 日の出, 本当, 理由, 耳, 自分, 購入, 選択, 音,

iOS 14 Widgets[ウィジェット]

2020.07.01

Logging

iOS 14 Widgets[ウィジェット]の最初の感想はいまいちだったんだけど、下記の動画を見て結構使えるじゃないかなと思っています。ただウィジェットを使いすぎると見た目が悪くなりそうな気もします。使いやすいようになったと言えばそうなんですけど。創業者だったスティーブ・ジョブズさんはどう思っているかと思うと…。

ただアップルが変わりつつ有ることは確かだなと思います。使いやさとデザインの両立って結構、大変な問題かなと思います。それに加えて技術的要素なども関係してくるから製品を作るのは結構大変な事だと思います。ある意味、妥協しつつ、技術が追いつけば昔の引き出しからデザインを足すという形なんでしょうね。

そんなウィジェットのことよりもPicture in Picture (PiP)[ピクチャ・イン・ピクチャ]がiPhoneでも出来るようになったことが自分にとっては朗報かなと思います。これでゴロゴロしながらってのがもっと効率的になりますよね。

これは怠惰なひとを増やす、恐ろしい機能です?。

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2020年07月01 08:09日

タグ

14, in, iOS, iPhone, Picture, pip, Widgets, アップル, いまいち, いん, ウィジェット, こと, これ, さと, ジョブズ, スティーブ, それ, デザイン, ピクチャ, 下記, 両立, 事, 創業者, 動画, 問題, 大変, 妥協, 引き出し, 形, 意味, 感想, 技術, 昔, 最初, 朗報, 気, 自分, 製品, 要素, 見た目, 関係,

inliving=いんりびんぐと読みます。

2020.03.15

Logging

いんりびんぐ（ririka / vlog）さんのvlogです。中堅YOUTUBERというあたりのポジションかなと思います。ちなみに自分が知った頃はもっと登録者数は少なかったように覚えています。このひと、数年前からYOUTUBEやメディアに登場している人なので、どちらかと言えばプロレベルだと思います。女性層と男性層といえば男性層の登録者数が多そうだなと思います。

こういう人はスタイルも顔も良いので何をしてもいいねされそうです。ショップも運営しているみたいです。ただ女性層に敵がいそうな気もします。有名になればなるほど、いろいろな人がいるので大変かと思いますね。これからも頑張っていってもらいたいですね。そしてUNIQLOや無印良品でセンスよく見えるのは着こなし方、コーディネートが上手いからと顔も良いからという理由も少なからずあるでしょうね。本人がそう思っていなくても。

最後にチャンネル登録はこちらになります。
https://www.youtube.com/channel/UC-kl8i6lq_ObZAn4kTL2WHA/featured

著者名 @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2020年03月15 08:45日

タグ

htt, inliving, ririka, UNIQLO, Vlog, youtube, YOUTUBER, あたり, いろいろ, いん, がいそう, ぐ, コーディネート, こちら, これ, ショップ, スタイル, センス, チャンネル, どちらか, ひと, プロ, ポジション, メディア, りびん, レベル, 中堅, 人, 何, 大変, 女性層, 数, 敵, 最後, 有名, 本人, 気, 無印良品, 理由, 男性層, 登場, 登録, 登録者, 自分, 運営, 頃, 顔,

datetimepicker-master：：でいとたいむぴっかーマスター！！日本語化

2017.10.14

Logging

datetimepicker-masterが日本語化できない。時刻だけ表示したい、カレンダーだけ表示したいなどに
実は対応しているのだけど、バージョンがアップしてからそのやり方が変わっていて
ググってもそのやり方が出てこないので、じぶんが記載してみました。
ソースを読まないと見えてこないものが有るですが、ぶっちゃけ他人のソースを読むのは面倒くさいでもプラグインは使用したい方。
下記のコードで日本語化可能です。
カレンダー非表示可能です。
時刻非表示可能です。
ちなみにソースを見るとdefault_options（でふぇるとおぷしょん）のオブジェクトで
その他、操作も可能ですのでソースを読みたい人は読んでみてください。
ちなみにちなみにdatetimepicker-masterプラグインはこちらからダウンロード可能です。
https://github.com/xdan/datetimepicker
サンプルプログラムはこちらです。
https://zip358.com/tool/datetimepicker

<!doctype html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>zip358.com:datetimepicker日本語</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=10.0, user-scalable=yes">
  <link rel="stylesheet" href="./datetimepicker-master/jquery.datetimepicker.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="./datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
  <script>
      $(function(){
          $.datetimepicker.setLocale("ja");//にほんご
          $("#dtp").datetimepicker({
              format:"Y/m/d H:i",
              formatTime:"H"//時間だけ(分：非表示)
          });
          $("#dtp2").datetimepicker({
              format:"Y/m/d",
              timepicker:false//時刻非表示
          });
          $("#dtp3").datetimepicker({
              format:"H:i",
              datepicker:false//カレンダー非表示
          });
      });
  </script>
</head>
<body>
    <input id="dtp" type="text">
    <input id="dtp2" type="text">
    <input id="dtp3" type="text">
    <div id="ana">
    </div>
</body>
</html>

著者名 @taoka_toshiaki

※この記事は著者が30代前半に書いたものです．

OFUSEで応援を送る

投稿日時 2017年10月14 03:45日

タグ

```, アップ, いん, ぇるとおぷしょん, オブジェクト, カレンダー, ググ, コード, こちら, サンプル, ソース, その他, ダウンロード, バージョン, フラグ, プログラム, ふん, もの, やり方, 下記, 他人, 使用, 可能, 対応, 操作, 日本語, 時刻, 時間, 表示, 記載,

@Blog

過去の蓄積を見るために書く日記.

ワードプレスのテーブルwp_postsデータを取ってきてLaravelで表示.

思ったことを綴って小銭が毎日入るのは良いけど、小銭止まり.

Picture-in-Pictureっていう拡張機能が良いです😍

sonyの🔗LinkBuds sを購入しましたのでレビュー。

airpodとsonyのlinkbudsどちら買おうかと思案してます。

iOS 14 Widgets[ウィジェット]

inliving=いんりびんぐと読みます。

datetimepicker-master：：でいとたいむぴっかーマスター！！日本語化