「広島でコンクリ」vol.16ブロックカスタマイズ 超初級
TRANSCRIPT
![Page 1: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/1.jpg)
『広島でコンクリ』vol.16
![Page 2: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/2.jpg)
![Page 3: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/3.jpg)
1. ブロックとはなんぞや2. ブロックの種類3. ブロックの使い方4. ブロックのカスタマイズ5. ブロックの仕組み6. 既存ブロックのデザイン変更
![Page 4: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/4.jpg)
![Page 5: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/5.jpg)
•テキスト•画像•お問い合わせフォーム•メニュー
ページ内に配置できるブロックに制限はない
![Page 6: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/6.jpg)
![Page 7: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/7.jpg)
•ページリスト•オートナビ• youtube• GoogleMap
![Page 8: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/8.jpg)
既存ブロックをデザインレベルで変更
![Page 9: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/9.jpg)
cssでclassを付与したり、htmlのタグを変えたりも出来る
![Page 10: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/10.jpg)
既存ブロックの処理(プログラム)変更
![Page 11: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/11.jpg)
•表示できるものを追加•文字数制限…など
![Page 12: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/12.jpg)
![Page 13: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/13.jpg)
ブロックはconcrete > blocks内に格納されている
![Page 14: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/14.jpg)
![Page 15: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/15.jpg)
ブロックはconcrete > blocks内に格納されている
![Page 16: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/16.jpg)
blocks内に格納されているfeatureファイルをまるっとコピーします。
![Page 17: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/17.jpg)
application > blocks内にペースト
![Page 18: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/18.jpg)
view.php、view.css、templatesフォルダ以外削除。↓templatesフォルダ内にtestフォルダを新規で作成しview.php、view.cssを移動。↓templatesフォルダ内testフォルダ以外削除
![Page 19: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/19.jpg)
ブロック特色を追加して、カスタムテンプレートTestを適応。
![Page 20: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/20.jpg)
div.ccm-block-feature-itemのbackgroundの色を変えてみると変わります。
![Page 21: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/21.jpg)
![Page 22: 「広島でコンクリ」vol.16ブロックカスタマイズ 超初級](https://reader031.vdocuments.net/reader031/viewer/2022021419/587759f71a28ab4e4f8b5137/html5/thumbnails/22.jpg)
『広島でコンクリ』vol.16