Webサイト専門プログラマの言いたい放題

元システムエンジニアがサイト制作とプログラミングについて好き放題しゃべります。

【CTA自動表示プラグイン 技術サポート後記】

f:id:wp-lesson:20170216123434p:plain

WordPressには、お問い合わせなどのCTAを
ブログ記事の下に自動で表示することができる
プラグインがあります。
 
CTAの表示内容をプラグインの画面で変更すると
全てのページに一斉に反映されるので便利です。
 
しかし、お使いのテーマによっては
「投稿」以外のカスタム投稿が追加されていて、
そこにもCTAが表示される場合があります。
 
そのようなご相談をいただきましたので、
ページごとにCTAの自動表示をON/OFFできる
プログラムを追加する技術サポートを
させていただきました。
 
<カスタマイズのポイントとなる知識>
 
WordPressにはページの「種類」がある
 ⇒投稿タイプと呼ぶ。
・投稿タイプを判定する関数がある
・記事のカテゴリーを探す関数がある
・カテゴリーや記事にカスタムフィールドを
 追加できるプラグインがある
・カスタムフィールドを表示に連動するには
 テンプレートやプラグインPHPファイルの
 プログラムを変更する必要がある
 
 
▼無料相談をお気軽にご利用ください。
http://codemy-lesson.office-ing.net/contact
 
━━━━━━━━━━━━━━━━━━
講師が執筆した本が発売されました
━━━━━━━━━━━━━━━━━━
 
『ホームページ作成のツボとコツがゼッタイにわかる本』
定価: 2,400円(税別)出版社:秀和システム
 
Amazon購入ページはこちら
http://amzn.to/2bXJkbs
 
━━━━━━━━━━━━━━━━━━
CODEMYのオンラインレッスン
━━━━━━━━━━━━━━━━━━
 
【1】自宅でマンツーマンレッスン
http://codemy-lesson.office-ing.net/
知りたいことだけ学べる個人レッスンです。
 
【2】動画と個別添削のプログラミング講座
http://bit.ly/2h7ZeRJ
HTML/CSS/JavaScriptの基本が身に付くレッスンです。
↓動画講座を無料体験してください
http://bit.ly/2hw7mIy

【javascriptでスマホメニューを作ろう】

f:id:wp-lesson:20170215231856j:plain

アイコンをタップするとメニューが表示され、
もう一度タップするとメニューが消える。
 
レスポンシブなサイトで必ず見かけるスマホメニューを
初めて javascript を学ぶ生徒さんにお教えしました。
 
きちんと改行しても、
たった10行程度のプログラムで作れるのですが、
 
いろんな基本が詰っています。
 
・プログラムでHTMLにアクセスする方法
・プログラムでCSSを書き換える方法
・クリックやタップをプログラムで認識させる方法
 
来週のレッスンでは、これらをjQueryに置き換えて
もっとシンプルで全ブラウザに対応した動作に
改善していきます。
 
CODEMYのマンツーマンレッスンでは、
HTML5やCSS3を基礎からしっかり学びたい方のために、
コース学習の中でカリキュラムをご提案致します。
 
▼無料相談をお気軽にご利用ください。
http://codemy-lesson.office-ing.net/contact
 
━━━━━━━━━━━━━━━━━━
講師が執筆した本が発売されました
━━━━━━━━━━━━━━━━━━
 
『ホームページ作成のツボとコツがゼッタイにわかる本』
定価: 2,400円(税別)出版社:秀和システム
 
Amazon購入ページはこちら
http://amzn.to/2bXJkbs
 
━━━━━━━━━━━━━━━━━━
CODEMYのオンラインレッスン
━━━━━━━━━━━━━━━━━━
 
【1】自宅でマンツーマンレッスン
http://codemy-lesson.office-ing.net/
知りたいことだけ学べる個人レッスンです。
 
【2】動画と個別添削のプログラミング講座
http://bit.ly/2h7ZeRJ
HTML/CSS/JavaScriptの基本が身に付くレッスンです。
↓動画講座を無料体験してください
http://bit.ly/2hw7mIy

【動画とマンツーマン~HTML基本講座の風景~】

f:id:wp-lesson:20170214171116p:plain

在日観光客へのガイドとなるウェブサービス
立ち上げるべく、WordPressを土台に各種API
組み込みに挑んでおられる生徒さん。
 
いきなりAPIと言っても、ウェブの基本である
HTMLやCSSJavascriptがわかっていなければ
組み合わせるための『発想』が生まれません。
 
そのため、基本を身に付けるために動画講座で
HTML、CSSJavascriptを学んでおられます。
 
添付は、課題の添削風景です。
 
『なぜこう書くのか』『どこに目を付けるのか』
という、独学で学びにくい考え方を実演+解説
付きの動画で学びつつ、疑問に感じたことを
チャットワークで質問すると、体系的な視点から
詳しいアドバイスを受けられます。
 
「そういうことだったのか・・・」
 
という深い納得が得られるので、
確かな知識をもとに自分で考えることが
可能になっていきます。

CODEMYのマンツーマンレッスンでは、
HTML5やCSS3を基礎からしっかり学びたい方のために、
コース学習の中でカリキュラムをご提案致します。
 
▼無料相談をお気軽にご利用ください。
http://codemy-lesson.office-ing.net/contact
 
━━━━━━━━━━━━━━━━━━
講師が執筆した本が発売されました
━━━━━━━━━━━━━━━━━━
 
『ホームページ作成のツボとコツがゼッタイにわかる本』
定価: 2,400円(税別)出版社:秀和システム
 
Amazon購入ページはこちら
http://amzn.to/2bXJkbs
 
━━━━━━━━━━━━━━━━━━
CODEMYのオンラインレッスン
━━━━━━━━━━━━━━━━━━
 
【1】自宅でマンツーマンレッスン
http://codemy-lesson.office-ing.net/
知りたいことだけ学べる個人レッスンです。
 
【2】動画と個別添削のプログラミング講座
http://bit.ly/2h7ZeRJ
実習と添削でHTML/CSS/JavaScriptの基本が身に付くレッスンです。
↓動画講座を無料体験してください
http://bit.ly/2hw7mIy

【全ブラウザ対応 CSS3で作る「流れるテキスト」】

HTML4にあった「marquee」タグを使うと、タグの中に書いたテキストを
右から左へ自動でスクロールさせることができます。

ホームページの「新着情報」などによく使われていますね。

しかし、「marquee」タグは元々、IEインターネットエクスプローラー)独自のタグ。
そのため、現在のHTML5では非推奨とされており、将来的に廃止されるかも知れません。

そこで、CSS3のアニメーションの仕組みを応用すれば「marquee」タグと同様のことが
実現できます。

on-ze.com

【ECサイトの送料ルール変更プログラム】

f:id:wp-lesson:20170214170505j:plain
某スイーツショップのECサイト
複数エリアへの配送に対応するように
プログラムをカスタマイズしています。
 
プログラムは考え方1つ間違えると
どこかで必ず不具合が起こるので、
通常のパターンだけ動作確認してOKでも
安心できません。
 
プログラムが想定通りに動くことを
確かめるために、組み合わせパターンを
洗い出してテストケースを作成します。
 
そしてテスト結果(画面コピー)を
きちんと残して納品します。
 
プログラム自体は、筋道さえ考え付けば
あとは使う言語に沿った文法に置き換える
だけですが、むしろテストのパターンを
漏れなく正確に洗い出して実施するほうが
時間がかかります。
 
プログラムを書くスキルだけでなく、
品質を保証するためのテストパターンを
作成するスキルも大事です。

CODEMYのマンツーマンレッスンでは、
HTML5やCSS3を基礎からしっかり学びたい方のために、
コース学習の中でカリキュラムをご提案致します。
 
▼無料相談をお気軽にご利用ください。
http://codemy-lesson.office-ing.net/contact
 
━━━━━━━━━━━━━━━━━━
講師が執筆した本が発売されました
━━━━━━━━━━━━━━━━━━
 
『ホームページ作成のツボとコツがゼッタイにわかる本』
定価: 2,400円(税別)出版社:秀和システム
 
Amazon購入ページはこちら
http://amzn.to/2bXJkbs
 
━━━━━━━━━━━━━━━━━━
CODEMYのオンラインレッスン
━━━━━━━━━━━━━━━━━━
 
【1】自宅でマンツーマンレッスン
http://codemy-lesson.office-ing.net/
知りたいことだけ学べる個人レッスンです。
 
【2】動画と個別添削のプログラミング講座
http://bit.ly/2h7ZeRJ
実習と添削でHTML/CSS/JavaScriptの基本が身に付くレッスンです。
↓動画講座を無料体験してください
http://bit.ly/2hw7mIy