page: default mobile small medium desktop
form: feature

Anatomy of default.txp edit in TXP

Click to see the forms within page default.txp…

form: o_details

forms/misc/head.txp

Includes the usual suspects of the <head> tag, but with some extras:

Css cache-buster
Can be <txp:hide>hidden</txp:hide> when css changes are complete.
Localhost vs live site discrimination for css
Test your site scss/css without influencing what other users see by sourcing it from localhost instead.
Sharing meta tags for article images
Supporting email clients and social media will include a thumb preview when sharing a url.
Helper selector classes for the opening <body> tag
form: o_details

forms/misc/o_header_common.txp

<txp::o_header
  headerclass="o_header--sticky u_p l_beam space-between bottom l_width-limited--large"
  wraptag="div"
  wraptagclass="l_beam "
  headingclass="h3-style"
  sloganclass="h5-style"
  sections="a,b,c"
  sectionsexclude="d"
  menu
  menuclass="l_beam h5-style " />

Control the layout and styling of the site header/banner menu via class changes. A hamburger option is available.

form: o_details

forms/misc/o_pagination.txp

Displays previous/next links to suit context

Used to navigate between web pages, this form is context aware. It can be located lower down in the DOM, or removed/hidden entirely for smaller sites.

form: o_details

forms/article/feature.txp status: sticky

<txp:article 
  status="sticky"
  form="feature"
  limit="1"
  wraptag="div"
  class="u_p l_width-limited--large l_grid"
  />

Interpret this as ‘if an article has status: sticky, then use /forms/article/feature.txp’. The class attribute enables different grid types and spacings.

Sticky articles on list pages enjoy ‘hero’ treatment, displaying below the banner menu.

form: o_details

forms/article/default.txp status: live

<txp:article
  listform="thumb"
  wraptag="ul"
  limit="36"
  class="u_p a_list-bare l_width-limited--large l_grid  l_grid--auto l_grid--auto-mobile l_gap--large"
  />

Interpret this as ‘if an article has status: live, then use /forms/misc/thumb.txp. Repeat until 36 articles have been displayed. As no form is specified, use the default form if a thumb is clicked’.

The class attribute enables different grid types and spacings.

form: o_details

forms/misc/o_footer.txp

<txp::o_footer/>

Modify to suit your requirements.

form: o_details

forms/misc/o_javascript.txp

<txp::o_javascript />

all-grid typically only references a single javascript file (<script src="<txp:page_url type="theme_path" />/js/lazysizes/lazysizes.min.js"></script>) used for automatic responsive image sizing.

If called upon by a presentation module, o_javascript includes the necessary javascript files.