基金訓練に行ってきました。(77日目)


基金訓練(Webデザイン・プログラミング科)の77日目に行ってまいりました。
77日目は、WordPressの実習です。
デフォルトのテンプレート(twentyten)をカスタマイズして、トップページを固定ページにしたサイトを作成していきます。

77日目の内容は下記のとおりです。

1.前回のトップページ(固定ページ)にブログ新着記事を表示に記事本文を追加

前回、更新日時の新しい順に5件の記事の投稿日時とタイトルをトップページに表示しましたが、プラスして記事本文を表示するようにします。

説明

記事本文の1文字目から30字を表示します。

2.トップページ(固定ページ)に任意のカテゴリーのブログ新着記事を表示

トップページで見せたい記事を「お知らせ」等のカテゴリーにしておいて、そのカテゴリーの記事のみを表示します。

説明

配列$mypostsに、カテゴリーIDが3の記事の、更新日時順に5件の記事内の要素を代入します。

※カテゴリーIDは、PhpMyAdminでwp_termsテーブルをみれば、調べることができます。





カテゴリー: 職業訓練 | タグ: , , | コメント / トラックバック: 0個

基金訓練に行ってきました。(76日目)


基金訓練(Webデザイン・プログラミング科)の76日目に行ってまいりました。
76日目は、WordPressの実習です。
デフォルトのテンプレート(twentyten)をカスタマイズして、トップページを固定ページにしたサイトを作成していきます。

76日目の内容は下記のとおりです。

トップページ(固定ページ)にブログの新着記事を表示

top.phpに下記を記述すると、更新日時の新しい順に5件の記事の投稿日時とタイトルが表示されます。(タイトルにはリンクが張られます。)

説明

配列$mypostsに、更新日時順に5件の記事内の要素を代入します。

変数$postに、配列$mypostsの要素を代入した後 ~ を実行 を、配列数だけ繰り返します。

変数$postの要素の中の、投稿日時を表示します。

変数$postの要素の中の、パーマリンクを表示します。

変数$postの要素の中の、記事タイトルを表示します。





カテゴリー: 職業訓練 | タグ: , , | コメント / トラックバック: 0個

基金訓練に行ってきました。(75日目)


基金訓練(Webデザイン・プログラミング科)の75日目に行ってまいりました。
75日目は、Adobe Illustratorの実習です。

75日目の内容は下記のとおりです。

イラストレーターを使って既存のロゴをトレースの続き

ネット上にあるGIFなんかのロゴを取り込んで、そのロゴをイラストレーターでトレースする練習の続きです。

1.缶バッジのようなロゴの描き方

下のような絵の描き方です。

  • 1.真円と大小の楕円を楕円ツールで描きます。この時、
    楕円大の中に楕円小を描きます。
    真円と楕円大は、ロゴのベースとなる色で、楕円小は白で塗ります。
  • 2.真円の塗りを下図のような感じでグラデーションにします。
  • 3.ブレンドツールをダブルクリックしてオプションウインドウを出し、間隔をスムーズカラーにしてOKボタンを押します。
  • 4.楕円を2個共選択します。
  • 5.ブレンドツールをクリックして、それぞれの楕円の左のアンカーをクリックします。
  • 6.上記の結果、ブレンドツールによって、楕円は下のようになります。
  • 7.楕円を、缶バッジの光っている位置に移動します。
  • 8.楕円を回転します。
  • 9.ダイレクト選択ツールを使用しアンカー位置を調整して、楕円の形状を変えていきます。
  • 10.下図のような感じにします。
  • 11.回転ツールを使って、楕円を真円の中心を中心にして、回転コピーします。
  • 12.バウンディングボックスで大きさを調整します。
  • 13.全体を見ながら、それぞれのパスを調整し、全体を整えて完成です。

2.柄のついた文字の作り方

下のよう写真やイラストを柄をつけた文字の描き方です。

  • 1.柄になる写真をペーストし、文字ツールで文字を描きます。
    この時、レイヤーパネルで文字が上にあるようにします。
  • 2.文字を選択して、書式メニュー→アウトラインの作成 をクリックします。
  • 3.文字選択状態で、オブジェクトメニュー→複合パス→作成 をクリックします。
  • 4.文字を写真上に移動します。
    写真と文字の両方とも選択します。
    オブジェクトメニュー→クリッピングマスク→作成 をクリックして完成です。





カテゴリー: 職業訓練 | タグ: | コメント / トラックバック: 0個