6.2. Ինչից է բաղկացած Drupal 8 թեման: Stark թեմայի ակնարկ.

Drupal 7-ում դուք կարող եք արագ և հեշտությամբ ստեղծել ենթաթեմա Zen-ում և սկսել կառուցել ձեր կայքը: Drupal 8-ից ի վեր կան նաև մի քանի թեմաներ ստեղծողներ՝ ձեր սեփական թեմաները ստեղծելու համար: Բայց նախքան դրանց վրա ենթաթեմա անելը, դուք պետք է մի փոքր պարզեք, թե որտեղ է գտնվում:

Drupal ծրագրավորողները առաջարկում են դիտարկել Stark-ի օրինակի թեման: Այս թեման ավելացվել է Drupal-ին, որպեսզի ծանոթանաք թեմայի դասավորությանը: Տեսնենք, թե ինչ է թաքնված այս թեմայի ներսում.

Stark.info.yml ֆայլ

Մենք սկսում ենք վերանայումը stark.info.yml ֆայլով: Ավելի վաղ 7-րդ Drupal-ում թեմայի տվյալները պահվում էին .info ֆայլերում, Drupal 8-ն օգտագործում է YML ամենուր, ուստի .info ֆայլն այժմ info.yml է YML ձևաչափով: YML ձևաչափում բանալիներն ու արժեքներն առանձնացված են երկու կետով

Թեմայի անվանումը:

name: Stark

Նախագծի տեսակը կարող է լինել թեմա, մոդուլ: Մենք ունենք այս թեման.

type: theme

Նկարագրությունը ցուցադրված է էջում՝

Նկարագրություն. «Միտումնավոր պարզ թեմա՝ առանց ոճավորման՝ ցուցադրելու լռելյայն Drupal-ի HTML-ը և CSS-ը: Իմացեք, թե ինչպես ստեղծել հատուկ թեմա Stark-ից Theming Guide-ում:

Հարմարության համար Drupal նախագծերի խմբավորումը, օրինակ, երբ մոդուլները ներառված են, դրանք կխմբավորվեն ներդիրների մեջ.

package: Core

Contribut-ի մոդուլների տարբերակը ավտոմատ կերպով սահմանվում է, ուստի այստեղ է VERSION փոփոխականը, և տողն ինքնին մեկնաբանվում է: Փաստորեն, տարբերակը թվարկված է ստորև.

# version: VERSION

Drupal-ի հիմնական տարբերակը նույնպես մեկնաբանվում և տեղադրվում է ավտոմատ կերպով drupal.org-ի կողմից.

Drupal 8.8 և ավելի բարձր տարբերակների համար.

core: 8.x
core_version_requirement: ^8 || ^9

Drupal 8.8-ի և ստորևի համար.

# core: 8.x

Անկախ նրանից, թե նա օգտագործում է որոշ հիմնական թեմա, թե ոչ, կեղծ նշանակում է, որ նա չի օգտագործում.

base theme: false

Թեմայի տարբերակով բլոկը և որ միջուկը ավտոմատ կերպով տեղադրվում է drupal.org-ի կողմից.

# Information added by Drupal.org packaging script on 2016-02-03
version: '8.0.3'
core: '8.x'
project: 'drupal'
datestamp: 1454490380

Ֆայլ stark.libraries.yml

Այստեղ մենք ներառում ենք css և js թեմաների ֆայլերը.

global-styling:
  version: VERSION
  css:
    base:      
      css/layout.css: {}

Մենք կարող ենք նաև ներառել javascript ֆայլեր

global-styling:
  version: VERSION
  css:
    base:      
      css/layout.css: {}
  js:
    js/custom.js: {}

Հարկ է նաև նշել, որ jQuery-ն այժմ ընտրովի է օգտագործման համար և կարող է չցուցադրվել էջում: Եթե դուք օգտագործում եք jQuery ձեր հատուկ սկրիպտում, դուք պետք է այն ավելացնեք թեմային.

global-styling:
  version: VERSION
  css:
    base:      
      css/layout.css: {}
  js:
    js/custom.js: {}
  dependencies:
    - core/jquery

Բացի այդ, դուք կարող եք նաև սահմանել css ֆայլերի համար, թե որ ֆայլերը պետք է միշտ ցուցադրվեն, և որոնք միայն տպագիր տարբերակում

global-styling:
  version: VERSION
  css:
    base:      
      css/layout.css: {}
      css/style.css: {}
      css/colors.css: {}
      css/print.css: { media: print }
  js:
    js/custom.js: {}
  dependencies:
    - core/jquery

Նկարագրության ֆայլեր README.txt, screenshot.png

Այս ֆայլերը ցույց են տալիս, թե ինչ տեսք ունի թեման և ինչպես տեղադրել այն, եթե առկա են տեղադրման կամ օգտագործման առանձնահատկություններ:

Logo.svg ֆայլ

Լոգոյի ֆայլը ավտոմատ կերպով միացված է դիզայնի թեմային, եթե այն գտնվում է կայքի սկզբում: Դուք կարող եք նաև լրացնել ձեր պատկերանշանը թեմայի սահմանման միջոցով:

Config պանակ և stark.schema.yml ֆայլ

Մեկ այլ YML թեմայի ֆայլ, որում պահվում են թեմայի կարգավորումները: Stark թեմայի համար, ահա միայն Stark թեմայի կարգավորումների էջի վերնագիրը:

Պանակներ css, js

Այս թղթապանակները պահում են մաքսային css, javascript ֆայլեր: Մի մոռացեք, որ ֆայլը թղթապանակում դնելը բավարար չէ այն ներառելու համար։ Յուրաքանչյուր ֆայլ պետք է առանձին միացված լինի stark.libraries.yml-ի միջոցով:

Ֆայլ stark.breakpoints.yml

Այս ֆայլը սահմանում է կայքի բջջային տարբերակների էկրանի չափերը: Սա Drupal-ի նոր առանձնահատկությունն է, մենք այն մանրամասն կքննարկենք հաջորդ հոդվածներից մեկում:

stark.mobile:
   label: mobile
   mediaQuery: '(min-width: 0px)'
   weight: 0
   multipliers:
    - 1x
stark.narrow:
   label: narrow
   mediaQuery: 'all and (min-width: 480px) and (max-width: 959px)'
   weight: 1
   multipliers:
     - 1x
stark.wide:
   label: wide
   mediaQuery: 'all and (min-width: 960px)'
   weight: 2
   multipliers:
     - 1x

Ահա Stark-ին ծանոթանալու թեմա: Հաջորդ հոդվածում մենք կքննարկենք, թե ինչպես ստեղծել ձեր սեփական թեման՝ հիմնվելով Կայուն թեմայի վրա: