@Blog
日常日誌からプログラムやYOUTUBER紹介、旅日記まで日々更新中です。
ワードプレスのテーブル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
タグ
```, ;;⏩, あたり, いん, オート, お伝え, お話, クラス, コード, コア, こと, コネクション, コントローラー, コンフィグフォルダ, サイト, シェア, スクリプト, その他, それら, ダーク, データ, データベース, テーブル, ドップ, ヒント, ファイル, フラグ, ブレイド, プレス, ブログデータ, ボタン, モード, モデル, もの, よう, リンク, ローダ, ワード, 付与, 作成, 使用, 処理, 出力, 切り替え, 去年, 取得, 変更, 広告, 感じ, 明日, 明記, 流石, 簡単, 表示, 要素, 言語, 記述, 設定, 選択, 随時,
米国が債務不履行になったら20万ぐらいマイナスは覚悟かも。
2021.09.29
この頃、どんよりした天気が続きますね。
さて、米国が債務不履行になったら手持ちの２０％ぐらいマイナスは覚悟かもと思っています。こればかりはどうなるか分からないのですが、世界中に連鎖したら手持ちの２０％ マイナスになるよ。例えば投資信託で100万円あったとすると20万円マイナスになるよということです。そんな感じで債務不履行なったらそれぐらいは吹っ飛びそうです。
非常にヤバいなと思っています。もし債務不履行になったらなったらで仕方がないとも思っています。
世界恐慌になったとしても流石に資産がすべて吹っ飛ぶとかにはならないとは思いますがね。中国、アメリカ、日本…とまぁ世界中がヤバい橋を渡っているような気がしますが…どうなるかは誰にもわからないですよ。
日本では本日、総裁選が行われますよね。もし河野さんが選ばれたら株価は上がりそうですが、岸田さんが選ばれたら株価は下がりそうな気がします。国民の支持は河野さんが多いらしいのでメディアは勝てば称賛するでしょうけど岸田さんがなったら、日本の政治は変わらないだねとたちまちバッシングに転じそうです。
アメリカも日本、そして中国・・・心配のタネはつきませんね。
著者名
@taoka_toshiaki
※この記事は著者が40代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
100, 20, アメリカ, こと, こればかり, すべて, それぐらい, マイナス, 万, 世界, 中国, 債務, 国民, 天気, 履行, 岸田, 恐慌, 感じ, 手持ち, 投資信託, 支持, 日本, 本日, 株価, 橋, 気, 河, 河野, 流石, 米国, 総裁選, 覚悟, 誰, 資産, 連鎖, 頃,