クリエイターのためのHP制作
- クリエイターのためのHP制作
1_HPを持つことの重要性
このカテゴリーは初心者の方でもHPを持つことができるような流れで作られています。そして、そのHPのツールとして「Wordpress」を使用していきます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
2_サーバーを借りる
「サーバー」...簡単に言ってしまえば「インターネット上の外付けハードディスク」です。ここではその「サーバー契約」に関して解説していきます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
3_ドメインを取得する
ドメインとは「.com」「.co.jp」のように、HPアドレスの後ろに付属する文字のことです。Lolipopとも親和性が高い、「ムームードメイン」で進めていきます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
4_サーバーとドメインを関連付ける
ドメインを取得しただけでは、まだHPに反映されません。サーバー側の「ロリポップ」と関連付けを行う必要があります。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
5_FTPソフトのダウンロードと設定
「パソコン」と「サーバー」を結びつける役目の「FTPソフト」を「Wordpress」をインストールの前にダウンロードしましょう！...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
6_WordPressをインストールする
ここではサーバー（ロリポップ）の設定からWordpressのインストールまでを解説致します。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
7_WordPressの設定を行う
ここではWordpress初期設定について解説致します。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
8_テーマを決める
実際にインストールを行った「Wordpress」へアクセスしてみましょう。 「設定したURL/wordpress」でアクセスが可能です。 ここからが面白いところです。 Wordpress...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
9_WordPressテーマをインストールする
前項でダウンロードをWordpressテーマをインストールしていきます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
10_「URL」からWordPressの表記を外す
取得したURLは : http://sleepfreaks-test.comです。 これは後にも処理が可能ですが、 手間を考えると、早い段階で行っておくべきです。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
11_リンクを最適化する パーマネントリンク
Wordpressカスタマイズとして最初に設定を行っておきたい項目が、 リンクを最適化するための「パーマネントリンク」です。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
12_サイトのキャッチフレーズを設定する
サイトへサブタイトルをつけることで、 ユーザーにサイト内容を伝えられる 検索エンジンに引っかかりやすくなる などのメリットがあります。 設定しておいて損は無いのでここで行ってしまいましょう。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
13_固定ページと投稿記事
サイトが整ってきた後は、何か情報を公開してみましょう。 Wordpressの公開には2種類の概念があります。 「固定ページ」と「投稿記事」です。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
14_カテゴリーの設定
前項で「固定ページ」と「投稿記事」を把握していただいた後は、 実際に「投稿記事」を作成してみましょう。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
15_画像を配置する
投稿記事には画像を配置することができます。 画像を使用することで、閲覧者が記事を把握しやすくなり、 より内容が伝わる記事に仕上げることができます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
16_プラグインの追加
Wordpressの魅力として、挙げられるのが「プラグイン」です。 このプラグインを使用することで、HPに様々な機能を追加することができます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
17_文章を画像の横に配置する 回り込み
記事を作成している際、 画像の下ではなく、文章を画像の左右に配置したいということが多々あります。 これを「回り込み」と呼びます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
18_リスト表示を使用する
「リスト」とは複数の項目を整列させ、わかりやすく表示するタグのことです。 伝えたい文章を整理する際に重宝します。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
19_リンクを配置する
HPで絶対に外すことができないのが「リンク」です。 HP内の記事同士は勿論。 他サイトへのリンクを貼りたいことも多いかと思います。 ここでは「リンク」の設置を解説していきます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
20_Youtube動画を埋め込む
音楽活動を行っていて、欠かすことができないもの。 「サウンドの視聴」です。 ここからは配信に頻繁使用される、3コンテンツの埋め込みを解説していきます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
21_SoundCloudを埋め込む
Youtube動画に続いて、人気の「SoundCloud」を埋め込んでいきます。 手順はYoutubeと同様です。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
22_MP3を設置する
DAWで作成した「MP3」を記事へ設置することができます。 活動報告とともに使用すると効果絶大です。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
23_Hタグを使用する
記事の中で使用する重要タグとして「Hタグ」があります。 この「Hタグ」は見出しとも呼ばれており、 記事の中で「重要な言葉」や「段落」で使用されます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
24_ 記事を公開する
記事が完成した後は、実際に「公開」を行ってみましょう。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
25_メールアドレスを作成する
ドメインを取得したメリットはHPのURLだけではありません。 そのドメイン名で好みのメールアドレスを作成することができます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
26_サイドバーをカスタマイズする
「サイドバー」とはHPの左右に配置された項目部分のことです。 今回選択したテーマには何もありません。。 ここでは「サイドバーを設置」してみましょう。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
27_固定ページの作成
「記事を公開する」ではブログ形式に近い形で記事公開を解説してきました。 ここでは「固定ページ」を作成してみましょう。 「プロフィール」「音源販売」「お問い合わせ」など 時系列に関係なく常...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
28_固定ページをメニューに設定
前項では「固定ページ」を作成しました。 しかし、これらがトップページに配置されていないため、全く意味がありません。 これを目につきやすい「メニュー」に配置していきましょう。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
29_ソーシャルを配置する
ソーシャルを使用している場合は、 これらのリンクを配置して、様々な情報を閲覧してもらえるようにしましょう。 それとは逆に、ソーシャルからのHPリンクも必ず行ってください。 興味を持った閲覧者にも...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
30_お問い合わせフォームを設置する
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
31_ ヘッダーへロゴを挿入する
ここではサイトの顔とも言える「ヘッダー」に手を加えてみます。 ヘッダーとはHPこの部分です。 全ページで共通し表示されます。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
32_フッターを設定する
「フッター」とはHPの下部分のことを指します。 現在のテーマでは既に「フッター文章」が設定されていますので、 これを変更してみましょう。...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
33_不必要なヘッダー情報を削除する
不必要なヘッダー部分があります。 削除を行い、更にサイトを洗練していきます。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
34_ロゴと背景色を統一する
いよいよ記事も最後となります。 以前に「ロゴ画像」をヘッダーへ配置しました。 背景と色が異なります。これを修正していきましょう。 ...
- CATEGORY:
- クリエイターのためのHP制作
- TAGS:
