ネットコンテンツ全般から日々のお役立ち情報まで分かりやすくお届け | ふかふか交易所

ふかふか交易所

HP・ブログ関連

HP・ブログ関連

2019/4/7

HTMLやCSSのソースコードをそのままページに貼り付ける方法

ホームページやブログで自身のソースコードを表示したい際に、HTMLやCSSのソースコードをそのまま貼り付けることのできる方法を紹介します! 貼付け用ウィジェットを『GitHub』で生成 手順①: まず「GitHub Gist」さんのサイトにアクセスしてください。 手順②: "Language:Text"をクリックして貼り付けたいソースコードの言語を選択し、下の枠内に表示したいソースコードを記述して、 下の"Create Pubric Gist"というボタンをクリックしてください。 手順③: クリックすると ...

HP・ブログ関連

2019/4/7

タブごとに内容を切り替える「タブメニュー」をホームページに作成する方法

ページを切り替えることなく、同じページ内でタブごとに表示内容を変更する「タブメニュー」の作り方について、今回簡単に紹介しようと思います! ちなみにタブメニューとは↓のように、タブをクリックするとページ移動することなく、ボックスの中身のみが切り替わるというものです。 タブ1タブ2タブ3  タブ1の内容です。画像やリンクを含めることもできます。  タブ2の内容です。画像やリンクを含めることもできます。  タブ3の内容です。画像やリンクを含めることもできます。 ※ 今回の解説では、↑の実装例で示したものと同じよ ...

HP・ブログ関連

2019/4/7

クリックでその場に画像を拡大表示!ホームページに「LightBox」機能を実装する方法

画像をクリックすると、 別ページに飛ぶことなくその場で拡大表示してくれるjQueryの有名プラグイン「LightBox」を ホームページに実装する方法について、簡単に解説します! ▼ 実装例(画像をクリックすると拡大します) ①「LiteBox Plus+」プラグインのダウンロード 「LightBox Plus+」のダウンロードサイトへ行き、下の方にスクロールすると見える Downloadボタンを押して「lightbox_sample.zip」という.zipファイルをダウンロードしてください。 ダウンロー ...

HP・ブログ関連

2019/4/7

ページのスクロールに合わせて付いてくるサイドバーを実装する方法

色々なホームページでよく見かける、"ページのスクロールに合わせて付いてくるサイドバー" を実装する方法について紹介します!(Ggoogle Chrome, IE11動作確認) 具体的にどんな感じになるかについては、PC表示にしてこのページのサイドバーに注目しながらページを下の方に スクロールしてみてください。 スクロールすると、それに合わせて一緒についてくると思います。 ① Jqueryプラグインのダウンロード この機能を実装するためにはJqueryの「Sticky」というプラグインを導入する必要がありま ...

HP・ブログ関連 動画作成関連

2019/4/7

ホームページに音声を再生するプレーヤーを埋め込む方法

作成・編集したBGMや効果音等のサンプルを、ホームページ・ブログを見に来てくれた人に気軽に聞いて もらいたい! といった時に役に立つ"簡易mp3プレーヤー"をページに埋め込む方法を紹介します! ちなみに導入に成功すると↓のようなプレイヤーが表示されます 色々なサイトさんで見かけるような典型的なプレイヤーですね!では以下で導入手順について 解説していきます。 ① プレイヤー本体のダウンロード まず、mp3のプラグインファイルを、配布場所(←クリックで移動)からダウンロードしてください。 (「player_m ...

HP・ブログ関連 SEO対策

2019/6/12

画質はそのままで容量削減!超簡単:おススメ画像圧縮サイト

「画像を送信したいけど容量が重すぎて時間がかかる!」「ホームページにスライドショー機能を付けたはいいけど、ページの読み込みが遅くなった」 なんてお悩みを抱えた方々に今回、画質はほとんど変わらないまま、画像の容量だけを削減してくれるおススメのサイトをご紹介します! 画像の重さはマイナスにしかならない "画像"データの容量というのは、"動画"データに比べると個々では大したことの無いデータ量ですが、 油断してホームページやブログなどにバンバン貼りまくっていると、気づいたら思いもよらぬ容量になってしまい、 ページ ...

HP・ブログ関連

2019/6/9

超簡単!ホームページにスライドショー機能を実装する方法(JQuery)

自分のホームページに画像がどんどん移り変わるスライドショー機能を追加して賑やかにしたい! という方々のために今回、超簡単にスライドショーを設置する方法をご紹介します! ちなみに導入に成功するとこのようなスライドショーが実装されます(GoogleChrome, IE11, IOS動作確認) スライドショーの簡単な設置方法 まずは「bxSlilder」さんのサイトで配布されている JQueryのプラグインファイルをダウンロードしてください(画像の赤枠部分からダウンロード) 「jquery.bxslider.z ...

HP・ブログ関連

2019/4/17

HTMLサイトでも設置可能!ホームページにブログのような"一言コメント欄"を設置する方法

自分のホームページにブログでよく見るようなコメント機能を追加したい!でもCGIとか勉強するのメンドくさいし・・・。 そういった方のために今回、簡単に一言コメント欄を設置する方法を紹介します!(Google Chrome, IE11で動作確認) ちなみに導入に成功すると、このページの下部にあるようなコメント欄が設置されます。 ① プログラムのダウンロード まずはプログラムを配布して下さっている 「WebmasterTOOL」さんのサイトに行き、下の方にスクロールすると"一言コメント"のダウンロードボタン が ...

HP・ブログ関連 動画作成関連

2019/6/28

著作権フリー音楽・おすすめダウンロードサイトまとめ。利用規約等も紹介

みんなに見てもらえるような動画を作りたい!そんなときに欠かせないのがBGMです。 そこで今回、私も動画制作の時にいつも利用させて頂いている、フリー(無料)で収益化可能かつ、クオリティーの高いBGMを配布しているサイトさんを紹介しています! ※紹介する各サイトさんの利用規約は掲載時点のものです。利用規約が変更される恐れもあるので、利用する際は必ずサイトさんの規約に変更がないかを"直に"確認してください。 フリーBGM・音楽素材MusMus URL:http://musmus.main.jp/ ■利用規約 " ...

HP・ブログ関連

2019/4/7

夢のマイホームページ開設!

当ホームページをご覧に来て下さったみなさん、どうもありがとうございます! 未だ厳しい寒さの続く中、みなさんいかがお過ごしでしょうか。 私はと言うと大学の卒業論文の作成も終わり、 以前から一度作ってみたいと思っていたホームページ作りの勉強を地道にしていました!(なんというさみしい春休み・・・;) そしてホームページ作りを学び始めて約1か月、遂に念願のマイホームページを開設することができました!  その名も・・・ "ふかふか交易所" !! "ふかふか交易所"の目的 "交易所"には 「互いに品物の交換や売買をす ...

Copyright© ふかふか交易所 , 2019 All Rights Reserved.