BYU News Components
Web components to consume the BYU News API. A new release will be published the last Friday of each month.
CDN Integration
These component are in the BYU CDN. You can include them on your website with these tags in the head:
<link type="text/css" rel="stylesheet" href="https://cdn.byu.edu/byu-news-components/latest/byu-news-components.min.css">
<script async="" src="https://cdn.byu.edu/byu-news-components/latest/byu-news-components.min.js"></script>Components
BYU News
This is the component to use when you want to pull in a stream of stories and display them in a pretty list.
<byu-news categories="all" tags="all" max-date="2017-07-01" min-date="2017-04-01" story-limit="3"></byu-news>Attributes
- Categories: Reqired. The category ID's you want to consume, separated by '+'. If you want all categories, use the value
all. - Tags: Required. The tag ID's you want to consume, seperated by '+'. If you want all tags, use the value
all. - Max Date: The latest date a story should have been published.
- Min Date: The earlies date a story should have been published.
- Story Limit: The number of stories you want display.
NB: If you want the latest stories, just leave out the min-date and max-date attributes.
Customize Children
Customize the byu-story children of byu-news by using variable CSS. For example:
body {
--story-title-color: black;
--story-title-font-family: "Sentinel A", "Sentinel B", serif;
--story-teaser-font-family: "Roboto", sans-serif;
}--story-title-color: Changes the color of the story title. Default value is#002E5D(BYU Navy).--story-title-font-family: Changes the font-family of the title. Default value is"Gotham A", "Gotham B", Helvetica, sans-serif".--story-teaser-font-family: Changes the font-family of the teaser. Default value is the same as--story-title-font-family.
BYU Story
Still in Development. Currently only a child for the byu-news component.
This component takes a story's ID and displays that story on your site.
<byu-story story-id="12345"></byu-story>How To Contribute
Fork the Repo
Unless you have write access to the byu-theme-components repository or are on the Unicomm Web Developers team, you will need to fork this repository to contribute to it. Pull requests can be submitted the same way as if you had write access, just do it from your forked repo.
Development Environment
You need to be sure you have npm installed to develop this component. We recommend downloading v6.11.0 LTS of nodeJS. Once you've done that, clone the repo and in the project folder, run
npm install
yarn
DEPENDENCIES: For this component, after the first time you install dependencies, be sure to use yarn rather than npm install.
To run a local development server with a file watch, run
npm start
To assemble the final distribution bundle, run
npm run build
To run automatic unit tests, run
npm test