larva modules: `footer`

Available Variants

prototype

footer README

This module is the large footer at the bottom of each of PMC's sites. It contains a set of menus with corporate and company information, a newsletter signup, list of social networks, and a tip submission prompt.

This module should not be designed according to brand, and should only assume the primary font family for headings. It relies on the MobileHeightToggle JS pattern for handling the menus on smaller screens.

To use this module in a theme, the templates should be parsed from Larva, as well as the JSON for footer parsed from Larva.

If this module or any of the modules included in it are updated, follow these steps to update the module in a theme, or to use it for the first time:

Uncomment the relativeSrcOverride key in the parser object in larva.config.js
Ensure that the modified file time of the Twig file is later than the PHP files, or delete the existing PHP template files
run npm run parser from theme/assets/
run npm run write-json larva modules footer from theme/assets/
Re-comment relativeSrcOverride key in the parser object in larva.config.js

footer Twig The markup file.

<footer class="footer // {{ footer_classes }}">
	<div class="lrv-a-wrapper">
		{% include "@larva/modules/footer-menus/footer-menus.twig" with footer_menus %}

		{% if footer_social %}

			<div class="lrv-a-grid lrv-a-cols3@desktop lrv-u-border-t-1 lrv-u-border-color-grey lrv-u-padding-tb-1">
				<div class="lrv-u-border-r-1 lrv-u-border-color-grey lrv-u-padding-a-1 lrv-u-border-r-1@desktop">
					{% include "@larva/modules/footer-social/footer-social.twig" with footer_social %}
				</div>
				<div class="lrv-u-border-r-1 lrv-u-border-color-grey lrv-u-padding-a-1 lrv-u-border-t-1 lrv-u-border-t-0@desktop lrv-u-border-r-1@desktop">
					{% include "@larva/modules/footer-tip/footer-tip.twig" with footer_tip %}
				</div>
				<div class="lrv-u-border-r-1 lrv-u-border-color-grey lrv-u-padding-a-1 lrv-u-border-t-1 lrv-u-border-t-0@desktop">
					{% include "@larva/modules/footer-newsletter/footer-newsletter.twig" with footer_newsletter %}
				</div>
			</div>

		{% endif %}

	</div>
</footer>

footer JSON The data object for this pattern.

{
	"footer_classes": "lrv-u-background-color-black lrv-u-color-white lrv-u-padding-tb-1",
	"footer_menus": {
		"footer_menu_classes": "lrv-a-grid lrv-a-cols3@tablet lrv-u-background-color-black lrv-u-color-white",
		"o_navs": [
			{
				"modifier_class": "",
				"o_nav_classes": "lrv-js-MobileHeightToggle lrv-u-text-align-center@tablet lrv-u-border-a-1@mobile-max lrv-u-border-color-white",
				"o_nav_title_text": "Footer Menu",
				"o_nav_title_id_attr": "",
				"o_nav_title_classes": "lrv-js-MobileHeightToggle-trigger lrv-u-padding-lr-1 lrv-u-margin-tb-00 lrv-u-padding-t-1 lrv-u-padding-t-050@tablet lrv-u-padding-b-050 lrv-u-width-100p@mobile-max lrv-a-icon-after lrv-a-icon-arrow-down lrv-a-icon-after:margin-l-auto lrv-a-icon-after-remove@tablet lrv-a-icon-invert lrv-u-cursor-pointer lrv-u-font-family-primary lrv-u-font-weight-bold lrv-u-font-size-20",
				"o_nav_aria_labelledby_attr": "",
				"o_nav_screen_reader_id_attr": "optional-screen-reader",
				"o_nav_screen_reader_text": "optional screen reader",
				"o_nav_list_classes": "lrv-a-unstyle-list lrv-js-MobileHeightToggle-target lrv-u-padding-b-050",
				"o_nav_list_item_classes": "lrv-u-padding-lr-1 lrv-u-padding-tb-050 lrv-u-font-size-18@mobile-max lrv-u-font-size-12 lrv-u-color-grey-light lrv-u-color-white:hover",
				"o_nav_list_items": [
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					}
				],
				"o_nav_list_labelledby_attr": ""
			},
			{
				"modifier_class": "",
				"o_nav_classes": "lrv-js-MobileHeightToggle lrv-u-text-align-center@tablet lrv-u-border-a-1@mobile-max lrv-u-border-color-white",
				"o_nav_title_text": "Footer Menu",
				"o_nav_title_id_attr": "",
				"o_nav_title_classes": "lrv-js-MobileHeightToggle-trigger lrv-u-padding-lr-1 lrv-u-margin-tb-00 lrv-u-padding-t-1 lrv-u-padding-t-050@tablet lrv-u-padding-b-050 lrv-u-width-100p@mobile-max lrv-a-icon-after lrv-a-icon-arrow-down lrv-a-icon-after:margin-l-auto lrv-a-icon-after-remove@tablet lrv-a-icon-invert lrv-u-cursor-pointer lrv-u-font-family-primary lrv-u-font-weight-bold lrv-u-font-size-20",
				"o_nav_aria_labelledby_attr": "",
				"o_nav_screen_reader_id_attr": "optional-screen-reader",
				"o_nav_screen_reader_text": "optional screen reader",
				"o_nav_list_classes": "lrv-a-unstyle-list lrv-js-MobileHeightToggle-target lrv-u-padding-b-050",
				"o_nav_list_item_classes": "lrv-u-padding-lr-1 lrv-u-padding-tb-050 lrv-u-font-size-18@mobile-max lrv-u-font-size-12 lrv-u-color-grey-light lrv-u-color-white:hover",
				"o_nav_list_items": [
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					}
				],
				"o_nav_list_labelledby_attr": ""
			},
			{
				"modifier_class": "",
				"o_nav_classes": "lrv-js-MobileHeightToggle lrv-u-text-align-center@tablet lrv-u-border-a-1@mobile-max lrv-u-border-color-white",
				"o_nav_title_text": "Footer Menu",
				"o_nav_title_id_attr": "",
				"o_nav_title_classes": "lrv-js-MobileHeightToggle-trigger lrv-u-padding-lr-1 lrv-u-margin-tb-00 lrv-u-padding-t-1 lrv-u-padding-t-050@tablet lrv-u-padding-b-050 lrv-u-width-100p@mobile-max lrv-a-icon-after lrv-a-icon-arrow-down lrv-a-icon-after:margin-l-auto lrv-a-icon-after-remove@tablet lrv-a-icon-invert lrv-u-cursor-pointer lrv-u-font-family-primary lrv-u-font-weight-bold lrv-u-font-size-20",
				"o_nav_aria_labelledby_attr": "",
				"o_nav_screen_reader_id_attr": "optional-screen-reader",
				"o_nav_screen_reader_text": "optional screen reader",
				"o_nav_list_classes": "lrv-a-unstyle-list lrv-js-MobileHeightToggle-target lrv-u-padding-b-050",
				"o_nav_list_item_classes": "lrv-u-padding-lr-1 lrv-u-padding-tb-050 lrv-u-font-size-18@mobile-max lrv-u-font-size-12 lrv-u-color-grey-light lrv-u-color-white:hover",
				"o_nav_list_items": [
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					},
					{
						"modifier_class": "",
						"c_link_classes": "lrv-a-unstyle-link",
						"c_link_text": "A plain text link",
						"c_link_url": "#",
						"c_link_rel_attr": false,
						"c_link_aria_label_attr": false,
						"c_link_target_attr": false
					}
				],
				"o_nav_list_labelledby_attr": ""
			}
		]
	},
	"footer_social": {
		"footer_social_classes": "lrv-u-text-align-center lrv-u-color-white lrv-u-background-color-black",
		"c_title": {
			"c_title_classes": "lrv-u-margin-b-025 lrv-u-font-family-primary lrv-u-text-align-center",
			"c_title_tag_text": "",
			"c_title_id_attr": "title-of-a-story",
			"c_title_text": "Connect with Us",
			"c_title_markup": "",
			"c_title_link_classes": "",
			"c_title_url": false
		},
		"c_tagline": {
			"c_tagline_classes": "lrv-u-font-size-14 u-font-style-italic lrv-u-font-family-basic lrv-u-text-align-center",
			"c_tagline_text": "Get our latest stories in the feed of your favorite networks"
		},
		"o_social_list": {
			"o_social_list_classes": "lrv-a-unstyle-list lrv-u-flex lrv-u-align-items-center lrv-u-justify-content-center",
			"o_social_list_labelledby_attr": "",
			"o_social_list_icons": [
				{
					"c_icon_link_classes": " lrv-u-display-block lrv-u-border-radius-50p lrv-u-color-grey lrv-u-margin-lr-050 lrv-u-padding-a-050 lrv-u-background-color-white lrv-u-color-grey-dark:hover",
					"c_icon_name": "instagram",
					"c_icon_target_attr": "_blank",
					"c_icon_link_screen_reader_text": "Icon Link",
					"c_icon_url": "#",
					"c_icon_classes": "lrv-u-display-block lrv-u-width-16 lrv-u-height-16",
					"c_icon_rel_name": "noopener noreferrer",
					"c_icon_screen_reader_tag_text": "",
					"c_icon_screen_reader_text": "Plus Icon",
					"c_icon_screen_reader_title_attr": "Plus Icon"
				},
				{
					"c_icon_link_classes": " lrv-u-display-block lrv-u-border-radius-50p lrv-u-color-grey lrv-u-margin-lr-050 lrv-u-padding-a-050 lrv-u-background-color-white lrv-u-color-grey-dark:hover",
					"c_icon_name": "pinit",
					"c_icon_target_attr": "_blank",
					"c_icon_link_screen_reader_text": "Icon Link",
					"c_icon_url": "#",
					"c_icon_classes": "lrv-u-display-block lrv-u-width-16 lrv-u-height-16",
					"c_icon_rel_name": "noopener noreferrer",
					"c_icon_screen_reader_tag_text": "",
					"c_icon_screen_reader_text": "Plus Icon",
					"c_icon_screen_reader_title_attr": "Plus Icon"
				},
				{
					"c_icon_link_classes": " lrv-u-display-block lrv-u-border-radius-50p lrv-u-color-grey lrv-u-margin-lr-050 lrv-u-padding-a-050 lrv-u-background-color-white lrv-u-color-grey-dark:hover",
					"c_icon_name": "twitter",
					"c_icon_target_attr": "_blank",
					"c_icon_link_screen_reader_text": "Icon Link",
					"c_icon_url": "#",
					"c_icon_classes": "lrv-u-display-block lrv-u-width-16 lrv-u-height-16",
					"c_icon_rel_name": "noopener noreferrer",
					"c_icon_screen_reader_tag_text": "",
					"c_icon_screen_reader_text": "Plus Icon",
					"c_icon_screen_reader_title_attr": "Plus Icon"
				},
				{
					"c_icon_link_classes": " lrv-u-display-block lrv-u-border-radius-50p lrv-u-color-grey lrv-u-margin-lr-050 lrv-u-padding-a-050 lrv-u-background-color-white lrv-u-color-grey-dark:hover",
					"c_icon_name": "facebook",
					"c_icon_target_attr": "_blank",
					"c_icon_link_screen_reader_text": "Icon Link",
					"c_icon_url": "#",
					"c_icon_classes": "lrv-u-display-block lrv-u-width-16 lrv-u-height-16",
					"c_icon_rel_name": "noopener noreferrer",
					"c_icon_screen_reader_tag_text": "",
					"c_icon_screen_reader_text": "Plus Icon",
					"c_icon_screen_reader_title_attr": "Plus Icon"
				},
				{
					"c_icon_link_classes": " lrv-u-display-block lrv-u-border-radius-50p lrv-u-color-grey lrv-u-margin-lr-050 lrv-u-padding-a-050 lrv-u-background-color-white lrv-u-color-grey-dark:hover",
					"c_icon_name": "youtube",
					"c_icon_target_attr": "_blank",
					"c_icon_link_screen_reader_text": "Icon Link",
					"c_icon_url": "#",
					"c_icon_classes": "lrv-u-display-block lrv-u-width-16 lrv-u-height-16",
					"c_icon_rel_name": "noopener noreferrer",
					"c_icon_screen_reader_tag_text": "",
					"c_icon_screen_reader_text": "Plus Icon",
					"c_icon_screen_reader_title_attr": "Plus Icon"
				}
			]
		}
	},
	"footer_tip": {
		"footer_tip_classes": "lrv-u-text-align-center lrv-u-color-white lrv-u-background-color-black",
		"c_title": {
			"c_title_classes": "lrv-u-margin-b-025 lrv-u-font-family-primary",
			"c_title_tag_text": "",
			"c_title_id_attr": "title-of-a-story",
			"c_title_text": "Have a Tip?",
			"c_title_markup": "",
			"c_title_link_classes": "",
			"c_title_url": "#"
		},
		"c_tagline": {
			"c_tagline_classes": "lrv-u-font-size-14 u-font-style-italic lrv-u-font-family-basic",
			"c_tagline_text": "We want to hear from you! Send us a tip using our anonymous form."
		},
		"c_button": {
			"c_button_classes": "lrv-a-unstyle-button lrv-u-cursor-pointer lrv-u-display-inline-flexlrv-u-color-white lrv-u-color-grey-light:hover lrv-u-background-color-black lrv-u-font-size-12 lrv-u-font-weight-bold lrv-u-text-transform-uppercase lrv-a-icon-after lrv-a-icon-arrow-right lrv-a-icon-invert",
			"c_button_ga_tracking": {},
			"c_button_inner_classes": "lrv-u-color-white lrv-u-color-grey-light:hover",
			"c_button_rel_attr": "",
			"c_button_screen_reader_text": "Sign Up",
			"c_button_target_attr": "",
			"c_button_text": "Send Us a Tip",
			"c_button_type_attr": "submit",
			"c_button_url": "https://google.com"
		}
	},
	"footer_newsletter": {
		"footer_newsletter_classes": "lrv-u-text-align-center lrv-u-color-white lrv-u-background-color-black lrv-u-flex lrv-u-flex-direction-column lrv-u-align-items-center",
		"c_title": {
			"c_title_classes": "lrv-u-margin-b-025 lrv-u-font-family-primary lrv-u-text-align-center",
			"c_title_tag_text": "",
			"c_title_id_attr": "title-of-a-story",
			"c_title_text": "Stay In The Know",
			"c_title_markup": "",
			"c_title_link_classes": "",
			"c_title_url": false
		},
		"c_tagline": {
			"c_tagline_classes": "lrv-u-font-size-14 u-font-style-italic lrv-u-font-family-basic lrv-u-text-align-center",
			"c_tagline_text": "Sign up for our daily newsletter"
		},
		"c_tagline_terms": {
			"c_tagline_classes": "",
			"c_tagline_text": ""
		},
		"o_email_capture_form": {
			"o_email_capture_form_classes": "",
			"o_email_capture_form_context_name_attr": "FormPost",
			"o_email_capture_form_inner_classes": "lrv-u-flex lrv-u-align-items-center lrv-u-justify-content-center lrv-u-border-b-1 lrv-u-border-color-currentColor",
			"o_email_capture_form_action_url": "",
			"o_email_capture_form_button_text": "Sign up",
			"o_email_capture_form_name_attr": "email-capture-form",
			"o_email_capture_form_success_url": "",
			"c_button": {
				"c_button_classes": "lrv-a-unstyle-button lrv-u-cursor-pointer lrv-u-display-inline-flex lrv-a-icon-after lrv-a-icon-arrow-right lrv-a-icon-invert",
				"c_button_ga_tracking": {},
				"c_button_inner_classes": "lrv-a-screen-reader-only",
				"c_button_rel_attr": "",
				"c_button_screen_reader_text": "Sign Up",
				"c_button_target_attr": "",
				"c_button_text": "Sign Up",
				"c_button_type_attr": "submit",
				"c_button_url": ""
			},
			"c_email_field": {
				"c_email_field_classes": "lrv-u-font-size-14 lrv-u-flex lrv-u-align-items-center",
				"c_email_field_label_classes": "lrv-u-padding-r-050 lrv-u-font-weight-bold lrv-u-whitespace-nowrap",
				"c_email_field_label_text": "Your Email",
				"c_email_field_input_id_attr": "",
				"c_email_field_input_name_attr": "",
				"c_email_field_input_placeholder_attr": "email@example.com",
				"c_email_field_input_classes": "lrv-u-background-color-transparent lrv-u-border-a-0 lrv-u-color-currentColor lrv-u-padding-a-050 lrv-u-font-size-14"
			},
			"o_email_capture_form_hidden_field_items": []
		}
	}
}