-
Notifications
You must be signed in to change notification settings - Fork 71
Customizing JSON
For advanced users, the Apple News plugin allows you to customize JSON. Each Apple News component that is handled by the plugin has one or more JSON specs for the main component JSON, layouts and/or styles. Some components have multiple specs for each of those if they have different visual appearances in different contexts. Editing these specs allows you to implement more advanced features from Apple News Format than can be handled via theme settings.
To get started, go to Customize JSON from the Apple News menu:
Select the theme for which you want to customize JSON.
Next, select the component you wish to edit from the dropdown:
You will then see a form that shows the editable JSON specs for that component.
Some specs will include values in the format #token#
. These are tokens that represent dynamic values that will be inserted into the JSON when the post is published to Apple News.
There are three types of tokens:
- Spec-specific: These will be included with the default spec, and can be removed, but cannot be added to different specs. They are computed at the time that the spec is translated to JSON, and are specific to a particular spec.
- Postmeta: You can include postmeta values by including a token in the format
#postmeta.meta_key#
wheremeta_key
is the key of the postmeta that you want to include. Note that this only works on single postmeta values (get_post_meta
is called with the$single
parameter set totrue
). - Settings: All of the theme settings are available to be included in custom JSON specs. To include a value for a theme setting, simply use
#setting_name#
wheresetting_name
is the name of the setting you wish to include. The full list of available theme settings for use in tokens is as follows:ad_frequency
ad_margin
blockquote_background_color
blockquote_background_color_dark
blockquote_border_color
blockquote_border_color_dark
blockquote_border_style
blockquote_border_width
blockquote_color
blockquote_color_dark
blockquote_font
blockquote_line_height
blockquote_size
blockquote_tracking
body_background_color
body_background_color_dark
body_color
body_color_dark
body_font
body_line_height
body_link_color
body_link_color_dark
body_orientation
body_size
body_tracking
byline_color
byline_color_dark
byline_font
byline_format
byline_line_height
byline_size
byline_tracking
caption_color
caption_color_dark
caption_font
caption_line_height
caption_size
caption_tracking
cover_caption
dropcap_background_color
dropcap_background_color_dark
dropcap_color
dropcap_color_dark
dropcap_font
dropcap_number_of_characters
dropcap_number_of_lines
dropcap_number_of_raised_lines
dropcap_padding
enable_advertisement
gallery_type
header1_color
header1_color_dark
header1_font
header1_line_height
header1_size
header1_tracking
header2_color
header2_color_dark
header2_font
header2_line_height
header2_size
header2_tracking
header3_color
header3_color_dark
header3_font
header3_line_height
header3_size
header3_tracking
header4_color
header4_color_dark
header4_font
header4_line_height
header4_size
header4_tracking
header5_color
header5_color_dark
header5_font
header5_line_height
header5_size
header5_tracking
header6_color
header6_color_dark
header6_font
header6_line_height
header6_size
header6_tracking
initial_dropcap
layout_gutter
layout_margin
layout_width
monospaced_color
monospaced_color_dark
monospaced_font
monospaced_line_height
monospaced_size
monospaced_tracking
pullquote_border_color
pullquote_border_color_dark
pullquote_border_style
pullquote_border_width
pullquote_color
pullquote_color_dark
pullquote_font
pullquote_hanging_punctuation
pullquote_line_height
pullquote_size
pullquote_tracking
pullquote_transform
table_body_background_color
table_body_background_color_dark
table_body_color
table_body_color_dark
table_body_font
table_body_horizontal_alignment
table_body_line_height
table_body_padding
table_body_size
table_body_tracking
table_body_vertical_alignment
table_border_color
table_border_color_dark
table_border_style
table_border_width
table_header_background_color
table_header_background_color_dark
table_header_color
table_header_color_dark
table_header_font
table_header_horizontal_alignment
table_header_line_height
table_header_padding
table_header_size
table_header_tracking
table_header_vertical_alignment
When you have finished editing, click the Save JSON button. The new specs will now be used for that component when publishing posts to Apple News using the selected theme moving forward.
The following components and JSON specs are supported:
The main component JSON.
The default component layout.
The main component JSON, which is used when a caption is present.
The main component JSON.
The main component JSON.
The default component layout.
Layout settings for the last body component only.
The default component style.
The style for the first body component when drop caps are enabled.
The main component JSON.
The default component style.
The default component layout.
The main component JSON.
The main component JSON, which is used when a caption is present.
The default component layout.
The default component layout, which is used when a caption is present.
The component layout to use when the cover is positioned below text.
The main component JSON.
The default component layout.
The main component JSON.
The default component layout.
The main component JSON.
The default component layout.
This is a special component that is automatically inserted at the end of each article rendered by this theme. You can add whatever content you like, as long as it is valid Apple News Format. Typical use cases here would be calls to action for things like subscribing to newsletters.
The main component JSON. Defaults to nothing, in which case no End of Article module will appear. You may insert whatever you like here.
The default component layout. Defaults to nothing, in which case there will be no layout applied. You may insert whatever you like her.
The main component JSON.
The main component JSON.
The default component layout.
The main component JSON.
The default component layout.
The style for level 1 (H1) components.
The style for level 2 (H2) components.
The style for level 3 (H3) components.
The style for level 4 (H4) components.
The style for level 5 (H5) components.
The style for level 6 (H6) components.
Main component JSON for images without captions.
Main component JSON for images with captions.
Layout for images that are anchored to another component.
Layout for images that are not anchored to another component.
Layout for images that are not anchored to another component when full bleed images are enabled.
The main component JSON.
The main component JSON.
The default component style.
The main component JSON.
The default component style.
Styles for the button itself.
Styles for the text in the button.
Main component JSON when borders are not enabled for blockquotes in the theme.
Main component JSON when borders are enabled for blockquotes in the theme.
The default blockquote layout.
The default blockquote style.
Main component JSON when borders are not enabled for blockquotes in the theme.
Main component JSON when borders are enabled for blockquotes in the theme.
The default blockquote layout.
The default blockquote style.
The main component JSON.
The main component JSON, which is used when a caption is present.
The default component layout.
The default component style.
The main component JSON.
The default component style.
The default component layout.
The main component JSON.
The default component layout.
The main component JSON, which is used when a caption is present.
The main component JSON.
For support, please file an issue here on GitHub or visit the WordPress.org support forum.