drupal 8でサブテーマを作ってみる (超入門編)

Download Drupal 8でサブテーマを作ってみる (超入門編)

Post on 13-Apr-2017

269 views

Category:

Technology

0 download

Embed Size (px)

TRANSCRIPT

  • Drupal8

    ()

  • ()

    Aboutme

    Facebook:Twitter:Drupal.org:

    ANNAIIncDrupalJapanUserGroupDrupal

    https://www.facebook.com/yoshikazu.aoyama@blauerberg

    blauerberg

    https://annai.co.jp/https://groups.drupal.org/japanhttp://drupalsapporo.net/https://www.facebook.com/yoshikazu.aoyamahttps://twitter.com/blauerberghttps://www.drupal.org/u/blauerberg

  • ExperienceDrupalcontributor(Core,Views,Console,etc)

    MauticcontributorDrupalsite&systemInternetofThingsWebapplication(RubyonRails,Java,Node.js,etc)Cloud/Serversidedesignandadministration(InfrastructureasCode,DevOps)EmbeddedLinuxNetworkstackfortelecommunicationnetwork(xDSL,3G,3.5G)TCP/IPNetworkstack

    MaintainerofDrupalConsole()

    https://drupalconsole.com/docs/japanese

  • TopicsDrupal8Bootstrap

  • https://www.drupal.org/theme-guide/8

    https://www.drupal.org/theme-guide/8

  • D7

    {theme_name}.info->{theme_name}.info.ymltemplate.php->{theme_name}.theme

  • {theme_name}.info.ymlname: my_bootstrap_subthemetype: themedescription: My Boostrap sub themepackage: Custombase theme: bootstrapcore: 8.xversion: 8.x-1.0regions: navigation: 'Navigation' navigation_collapsible: 'Navigation (Collapsible)' header: 'Top Bar' highlighted: 'Highlighted' help: 'Help' content: 'Content' sidebar_first: 'Primary' sidebar_second: 'Secondary' footer: 'Footer' page_top: 'Page top' page_bottom: 'Page bottom'libraries: - my_bootstrap_subtheme/global-styling

  • cssjs

    libraries{theme_name}.info.yml{theme_name}/{library_name}

    libraries: - my_bootstrap_subtheme/global-styling

  • {theme_name}.libraries.ymlglobal-styling: css: theme: css/custom_style.css: {} js: js/custom_script.js: {}

  • css/custom_style.css

    .navbar-default .navbar-brand { color: #ff8c00;}

  • js/custom_script.jsBootstrap

    (function($){ console.log("execute my custom script"); $(".main-container").prepend($("").addClass("alert alert-info").attr("role", "alert").text})(jQuery);

  • https://github.com/blauerberg/my_bootstrap_subtheme

    https://github.com/blauerberg/my_bootstrap_subtheme

  • ThinkITDrupal8

    Drupal8

    https://thinkit.co.jp/series/5779

  • ANNAI

  • Contactus

    https://annai.co.jp/recruit

    https://annai.co.jp/recruit