• TOP
  • WordPress
    • まとめ
    • JavaScript
    • 記事
    • 画像/動画
    • 管理
    • アクセス/SEO対策
    • カテゴリ
    • サイドバー/ヘッダー
    • アイキャッチ
    • パスワード
    • コメント
  • プラグイン
  • CSS
  • ユーザー限定
Plus WordPress ワードプレスの基本・応用テクニックを紹介
ホーム › プラグイン › 最新記事を自動でスライドショー

最新記事を自動でスライドショー

プラグイン名 Smooth Slider

レスポンシブ対応「最新記事自動スライドショー」です。またカテゴリ別や個別記事、画像のみなど、複数のスライドショーを管理、設置できます。

設定はスライドの大きさや画像の大きさ、フォント、エフェクト、ナビなど、細かく調整できる高機能で使いやすい仕様です。

plug63

インストール手順

プラグイン > 新規追加 > Smooth Slider > プラグインを検索 > いますぐインストール > プラグインを有効化

Smooth Slider – A Free WordPress Slider Plugin from SliderVilla
https://slidervilla.com/smooth-slider/

設定

Smooth Slider > Settings > Basic Settings

plug63e
plug63f

Smooth Slider > Settings > Slides Panel

plug63g
plug63h
plug63i

↑サムネイルの設定項目にすべてチェックを入れた場合、アイキャッチが優先され、アイキャッチが設定されていなければ記事先頭の画像が使用されます。

plug63j

※From Content を選択した場合の文字数制限がうまく機能しません。Post Excerpは編集ページの抜粋に入力されているものが表示されます。

Smooth Slider > Settings > Preview

plug63k

Smooth Slider > Settings > Generated CSS

plug63l

ショートコード

  • ショートコードは、Smooth Slider > Settings > Preview(タイプを選択し変更保存)で確認できます。
  • 記事や固定ページに最新記事を表示する基本的なショートコード
    [smoothrecent]
    ※[]を大文字で表示しているので↑のショートコードは小文字の[]に変更してください。
  • テーマ内(php)の好きな場所に挿入する場合は↓
    1
    <?php if(function_exists("get_smooth_slider_recent")){get_smooth_slider_recent();}?>

気に入ったフォントがない場合

settings.phpを編集して好みのフォントを追加するのもいいかもしれませんが、面倒なので Smooth Slider > Settings > Basic Sttings > Custom Stylesに↓を追加。

1
2
3
4
5
6
7
8
9
// !importantで強制的にスライド内のフォントをすべて(Meiryo)に変更
 
.smooth_slider a,
.smooth_slider span,
.smooth_slider .smooth_slideri{
 
font-family: Meiryo!important;
 
}

個別画像だけのスライドショー

Smooth Slider > Sliders > Create New Slider

名前を入力しCreate New

plug63b

新しいスライド「demo001」を作成しました。

Upload で画像を選択してやるだけですが、画像選択時のメディアライブラリでキャプションに文字を追加すればスライドに表示されます。

plug63c

画像を2枚追加しました。表示順も入れ替えできます。

plug63c2

変更があればSave the orderで保存。

ショートコードなどは Smooth Slider > Settings >Previewでも確認できます。

個別記事のスライドショー

Smooth Slider > Sliders > Create New Slider

新しいスライド「demo002」を作成しました。

投稿記事の編集ページにSmooth Sliderという設定が追加されているので、Basicで「demo002」を割り当てて記事を更新します。

リンクを変更、またはリンクを外したい場合はその下で設定します。

plug63c3

Smooth Slider > Sliders > demo002

割り当てた記事が表示され、表示順も入れ替え可能です。

plug63c4

3Dなレスポンシブスライダー

同じところがフリーで提供している3Dなスライダーです。派手なのが好きな方はこちらの方がいいのかもしれません。使い方や設定などもSmooth Sliderと同じような感じなので、興味のある方はお試しください。Smooth Slider との共存(2つ同時に表示すること)も可能です。

plug63m

プラグイン名 Dbox Slider Lite

Free 3D Responsive WordPress Slider Plugin
https://slidervilla.com/dbox-lite/

インストール手順

プラグイン > 新規追加 > Dbox Slider Lite > プラグインを検索 > いますぐインストール > プラグインを有効化

設定

いくつか違う部分もありますが、大体同じなので省略します。プレビューを見ながら設定できるのでそこまで難しくありません。

ショートコード

  • 記事や固定ページに最新記事を表示する基本的なショートコード
    [dboxrecent]
    ※[]を大文字で表示しているので↑のショートコードは小文字の[]に変更してください。
  • テーマ内(php)の好きな場所に挿入する場合は↓

    1
    <?php if( function_exists( "get_dbox_slider_recent" ) ){ get_dbox_slider_recent(); } ?>

タグ: スライドショー
カテゴリー: プラグイン, 画像/動画
“最新記事を自動でスライドショー” への1件のコメント
"最新記事を自動でスライドショー" に 1 トラックバック・ピンバック
  1. 最新記事を自動でスライドショー WordPressコンテンツスライダー【Smooth Slider】プラグイン | My Tips and Quotes より:
    2015/04/20 06:43

    […] 最新記事を自動でスライドショー | Plus WordPress […]

コメントを残す コメントをキャンセル

関連記事
スライドショー Easing Slider “Lite”
スライドショー Meta Slider
スライドショー Meteor Slides
スライドショー WP Slider Plugin
スライドショー Skitter Slideshow
背景をスライドショーにする
人気記事
高機能でオシャレな実用的メニュー(HTMLテンプレート)
Webページ全体をフェードイン、フェードアウト
投稿、固定ページ内にウィジェットを挿入
記事の続きを読むを消す
最新記事を自動でスライドショー
コメントに画像を挿入できるようにする
指定したカテゴリIDのカテゴリ名のみ取得
フリーの高機能HTMLテンプレート
記事ごとに個別のCSSやJavaScriptを追加
特定のカテゴリに個別のCSSを適応させる
カテゴリ別に違うカテゴリ(テンプレート)を表示
タイトルや本文からタグを自動生成
画像や動画をポップアップし再生
非表示、置換テクニック
Contact Form7の送信完了画面をカスタマイズ
phpMyAdminのユーザー名とパスワードの確認方法
カテゴリー別に違うサイドバーを出す
CSS3のみで画面外からメニューをスライド表示
CSSやJavaScriptのハンドル名(id)を確認
管理画面の投稿一覧で投稿IDを表示する
アイキャッチ(サムネイル)を呼び出す
スライドショー Meteor Slides
カテゴリに別々のアイコンを表示
レスポンシブなLightbox jQuery プラグイン Strip
背景をスライドショーにする
ページごとに違うヘッダーを読み込む
コメントのメールアドレス入力覧を消す
記事をランダムに表示させる
CSS3 角を丸くする
スライドショー Skitter Slideshow
パスワードを間違えると一定時間ログインできないようにする
購読者にパスワードを変更させない
ショートコードを追加するプラグイン
管理画面の投稿一覧へアイキャッチを表示
個別にJavaScriptを振り分ける
Contact Form7に画像認証機能を追加
リンクの表示順を並べ替える
サイト全体のサムネイルサイズを変更
CSS3 ボックスシャドウ
JavaScriptで画面外からメニューをスライド表示
    メルマガ購読
  • メールマガジンではWordPressのおもしろい使い方を紹介しています。またユーザー限定ページとも連動しているので、そちらも自由に観覧できるようになります。
  • 登録フォーム
PlusWordPress
  • お問い合わせ
  • このサイトについて
Link
  • 人気ブログランキング
  • 使えるWordPressテーマ
背景変更
  • デフォルト
  • ホワイト
  • ブラック
  • グレー
  • Facebook
  • RSS Feed
  • Google Plus
© 2023 Plus WordPress