Code Monkey home page Code Monkey logo

service-manual's Introduction

Digital Guides

https://guides.service.gov.au/

We aim to provide clear, consistent and compelling guidance which will inspire teams and help support them with how to design and deliver great digital services.

Partial (layout) documentation

https://govau.github.io/service-manual/docs/

The Cuttlebelle auto-docs are deployed to the gh-pages branch.

To update the documentation after changing or adding a partial, change to the gh-pages branch and run npm run docs. Push it to deploy.

Visual regression tests

https://github.com/govau/backstop-guides-tests

These can be optionally run before a production deployment to visually see the difference.

It's good for non-functional changes to ensure there is no visual regression.

Staging environment

Test environments (automatic provisioning)

Development

All pull requests should be compared against develop. To keep things simple, opt for the Docker option but the DIY is also provided. First check out the repository:

git clone github.com/govau/service-manual
cd service-manual

Option 1: Docker

Build the Docker image:

service-manual$ docker build -t service-manual .

Run the image:

service-manual$ docker run --rm --volume="$PWD:/workdir" -p 80:8080 -it service-manual

Now point your browser to your docker host with something like http://localhost/

Option 2: DIY

It's recommended you install nvm to manage your local node version.

Change node version

nvm use

Install dependencies

npm install

Build the static assets

npm run build

Start the development server

npm run watch

Content

All content for the Service Manual is in the /content folder. We use Cuttlebelle as static site generator as to cleanly separate content from layout.

Images for content pages can be stored in the /content/assets folder.

Metadata

Metadata can be stored on pages within the index.yml file. All fields except for pagetitle are optional.

Fields

  • pagetitle (string required)
    • the page title
  • description (string optional)
    • the meta description
  • keywords (string, comma delimited list, optional)
    • for search engine
  • created_by (string optional)
    • is displayed on pages using intro_with_nav
  • published_date (ISO date yyyy-mm-dd optional)
    • is displayed on pages using intro_with_nav
    • make sure to form as a string e.g. "2018-05-12"
  • reviewed_date (ISO date yyyy-mm-dd optional)
    • is displayed on pages using intro_with_nav
    • make sure to form as a string e.g. "2018-05-12"
  • boost (integer optional)
    • influences the search engine results
  • hidden (boolean optional)
    • hides the page if set to true
  • weight (integer optional)
    • influences the ordering of menu items

Search engine

Search is provided by the Lunr javascript search engine.

Weight to search scoring is in the following descending order:

  1. keywords (boost = 30)
  2. title (boost = 10)
  3. description (boost = 5)
  4. body (no boost)

The content is indexed at build time, and can be influenced with the optional metadata fields keywords and boost.

Boost

Use small values, like 0.5 - 1 until your desired search result is attained.

Keywords

Keywords can be added in a comma delimited list.

Federated pages

External pages can be federated by adding data to scripts/federate.js

Special combos

Two word special word combinations can be added to improve results for specific queries. An example is the role 'delivery manager'.

How to add a special combo:

  1. Append the combination to the function specialCombos(query) in 06-search-results.js.
  2. Add the two word term into the keywords of the page

Search data static files

Search data and indexes are stored in the following static files, which are deployed with the site:

  1. documents.json (the site document data)
  2. pathmap.json (lookup table for the SERP)
  3. search_index.json (lunr's serialised index)

Rebuilding the search index in development

When experimenting with search tuning in development it is necessary to rebuild the search index after changing content or metadata. This can be done hot in another terminal window with Cuttlebelle running.

npm run build:search

service-manual's People

Contributors

anand-bhat avatar annekemyers avatar dominikwilkowski avatar gazhands avatar gordcorp avatar gregtarry avatar joolswood avatar korokseed avatar m-richo avatar marksantoso avatar matthewmccarthydto avatar meaghan-n avatar phend-117 avatar philba333 avatar sarah-cr avatar shad0wme0w avatar simonschwartz avatar sirleech avatar stevedta avatar sukhrajghuman avatar tobiasbrown avatar trebbrennan avatar trishat avatar zedzedzed avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

service-manual's Issues

Inconsistent image references for cards/card and blocks/imageblock partials

For cards/card partials, content designers currently need to prepend the '/assets/img' bit to their image paths, whereas they don't need to do this for the blocks/imageblock partials.
I'm raising this because this may cause confusion for the content team and cause images not to render as expected.

See screenshots for reference.
screen shot 2017-07-19 at 11 48 23 am
screen shot 2017-07-19 at 11 48 29 am

.textblock__quote missing icon

What happened

  • Noticed quote didn't have icon.
  • Inspecting the CSS shows a SCSS function which hasn't compiled correctly [screenshot below]
  • It appears to be referencing an old UI-kit function.

What I expected to happen

  • SVG icon renders in CSS like this:
    background-image: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' hei…/%3E %3Cpath fill='gray' d='M128 64l-16 16-64-64L64 0'/%3E %3C/svg%3E);

Reproducing

https://guides.service.gov.au/service-design-delivery-process/whole-user-experience/#government-services-and-products

screen shot 2018-05-03 at 1 23 26 pm

Start sorting the components into folder sections for better discoverability.

Maybe something like:

  • category
    • category_header
    • category_headline
    • category_section
    • category_sections
  • nav
    • section
    • sections
    • intro_with_nav
  • image
    • image_content_block
    • imageblock
    • imageblockevent
    • banner
  • structure
    • home_header
    • footer
    • header
  • other
    • cards
    • cards_category
    • dss-section
  • text
    • intro
    • quote
    • textblock
  • page layouts
    • page
    • topic

Remove package-lock.json from .gitignore

We initially put the package-lock.json file into the .gitignore so that users of the service manual didn't accidentally commit it with their content changes.

This needs to be removed as we will one day want to lock versions so we have exact dependencies across all users of the service manual.

https://docs.npmjs.com/files/package-lock.json

It describes the exact tree that was generated, such that subsequent installs are able to generate identical trees, regardless of intermediate dependency updates.

Update content on https://guides.service.gov.au/content-strategy/

We've received a request to update the content regarding our content community of practice on dta.gov.au. The request included some references to Guides.

What do you need?

On https://guides.service.gov.au/content-strategy/, can you please update the paragraph from Join the content community to To become a part of this group please email to read:

Join the Content Community of Practice

The Content Community of Practice is a place for government content specialists, practitioners and leaders to share ideas, solve problems, connect to peers and work in the open.

This community is hosted by the Digital Transformation Agency. People from all levels of government are welcome. You will need a government email address to join. Email [email protected] to join the Content Community of Practice.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.