Install Jekyll (once off)
- Following Jekyll on Ubuntu instructions
Run the site locally for testing
- Open a terminal in the garden repo and run
bundle exec jekyll serve
- Open a browser to http://localhost:4000/
-
Lou's Gardening and Landscaping Services - Facebook profile
- Uses a logo embedded design for before and after images.
- Specially adds (chemical spray) to his description of "weed control"
- Services within 20Km of Regency downs (Near Plainlands)
-
Gardening Services Brisbane - Lawns, Weeds, Hedges & Clean Ups
| Tag | size | w | Description | | --- | ----- | ----------- | | xl | > 1200px | 1200w | Extra large desktop | | lg | 992px - 1200px | 900w | Large desktop | | md | 600 | 600w | Tablet | | sm | 300 | 300w | Mobile |
Rainbow
filename | w |
---|---|
rainbow-hero.jpg | 1200 |
rainbow-hero-lg.jpg | 900 |
rainbow-hero-md.jpg | 600 |
rainbow-hero-sm.jpg | 300 |
<img
src="/images/{{ page.hero_image }}"
srcset="images/{{ page.hero_image }}-sm.jpg 300w,
images/{{ page.hero_image }}-md.jpg 900w,
images/{{ page.hero_image }}-lg.jpg 900w,
images/{{ page.hero_image }}-xl.jpg 1200w"
sizes="(max-width: 640px) 100vw,
(max-width: 960px) 80vw,
60vw"
alt="{{ page.hero_alt }}">
Collections pages are the second level pages that contain a collection of items. For example, the Gardening page contains a collection of gardening services. The visual design of these pages is to have
-
an intro section with a heading and introductory text
-
followed by a list of items in the collection
-
underneath all of this is a background image
The background image is optional. If not specified the page will default to a plain background.
For the image to work you need to
- add a large and small version of the image into the
images
folder (at a point of your choosing) both saved as.jpg
files - add the full path to the image (minus the
.jpg
extension) into the front matter of the relevant collection's markdown page
For example,
- Gardening uses the mowing-bird image that can be found in /images/gardening/mowing-bird.jpg (the large version) and /images/gardening/mowing-bird-sm.jpg (the small version)
- In the front matter of the
gardening.md
file you would addbackground_image: "/images/gardening/mowing-bird"
General design
-
check the size of the content images
-
check the meta data for images
-
1st level image re-design to be background
-
is there a better design for content images (including a caption)
-
"scrolling" page design
2nd level pages, rather than a background banner image allow for the content to scroll over it.
- make this change to all the 2nd level pages
-
Should/can 3rd level pages have background images? or images placed somewhere else on the page
Play around with the mowing bird photo placed into the content to break it up, rather than as a background
-
3rd level header design
- Possible to include the name of the collection into the header/navigation for the items in the collection?
-
Decide on whether or not the business name should be used in content, rather than "we"
-
Make all the "contact us" (e.g. gardening services) into links to the contact page
-
Develop an internal links style for longer pages (perhaps programatically through Jekyll)
- About
- Project pages
-
Consider developing a table style
Home Page
- "View all Design" add "services"
- change headings for gardening and design to add services
Gardening
-
Mowing
- Ensure the numbered list is a numbered list
- add in photo
- Is this the best photo (format wise) for this? Duplicate of gardening
-
Weeding
- More content for the description sandy
- Add the arrows back into the next/prev (probably due to the absence of font awesome) Need to look for a low weight way of adding in those icons
-
Tree care
Remove mention of the business name
-
Holiday care
Add in a design for "note"
Design
-
Not all services content written
-
Approach
- Typo "WOrking closely with your"
-
Process
- write intro
- Need to remove the references to other sites (and stealing their content)
-
Options
- Does this get rolled into "approach"
-
Example styles
- Should this be earlier?
Projects
-
Duck Meadows
- Accept the suggestion
- the before image is missing
- remove the "refs" at the bottom of the page??
-
Narelle's
- re-write the intro
- superscript with m^2
- get images from Sandy
About
- [x] rewrite - remove business name
- [x] add links to web pages
- [x] not so much "full and"
- [ ] Move "locations and services" to other places? Perhaps implement as an include
- Contact
- Design and gardening services (perhaps these each need to provide some detail)
Contact
- update page design
- Remove "site test" section