Junior School Design

Junior School Design v1.0.0(2016/05/19)

Screenshot of junior school design, customize of graftee.


This design is junior school website design.
It is refreshing blue-based color scheme,
And it is the layout and clean a room in the interval.
It was including cuteness ish junior school.

Because the layout is difficult to read next to too wide, this was a fixed width.
That is in the margin was to arrange wispy junior school emblem.

  1. File List
  2. Create File
  3. Customize
  4. Create Top Page
  5. caution

File List

  • example-top-page.txt
  • junior-school-design.css
  • name.png
  • no-repeat.png
  • readme.txt
  • repeat.png
  • repeat-x.png

Create File

  1. Create your school name image from name.png.
  2. Create your school emblem from repeat.png.
  3. Edit your school photo in no-repeat.png.
    School photo is not change scale.
    You must edit junior-school-design.css, if you change photo scale.

  4. Upload these images in ‘Media’ menu.
  5. Edit these image’s url in junior-school-design.css.
  6. Upload junior-school-design.css.


  1. Set your school name in ‘Site Title’ in ‘Customizer -> Site Identity’.
  2. Set your school name image in ‘Site Title Image Url’ in ‘Customizer -> Site Identity’.
  3. Check ‘Show breadcrumbs’ in ‘Customizer -> graftee Settings’.
  4. Check ‘Display font size button’ in ‘Customizer -> graftee Settings’.
  5. Check ‘Disabled style.css’ in ‘Customizer -> graftee Settings’.
  6. Set url of junior-school-design.css in ‘Add CSS file’ in ‘Customizer -> graftee Settings’.

Create Top Page

  1. You create ‘news’ category.
  2. Copy url of ‘news’ category.
  3. Add someone posts in ‘news’ category.
    (When the post is recommended the setting of the featured image.)

  4. Add new page in reference to the example-top-page.txt
  5. Set ‘Front page displays’ in ‘Settings -> Reading’,
    checke ‘A static page(select below)’ and select added page in ‘Front page’.

  6. Add someone pages.
  7. Create ‘Menu’ in ‘Appearance -> Menus’.
  8. Create ‘Secondary Menu’ in ‘Appearance -> Menus’.
  9. Create ‘Toppage Menu’ in ‘Appearance -> Menus’.

That’s all there is to it. congratulations.


This is not theme!!
Do not use ‘customizer -> Header Image’.
If you want change header image, you must change no-repeat.svg file and ….

This is example of customize!!