Newsfeed Layout

In the channel_config.json file, you can configure the size of tiles, font types, and sizes. The file offers various display options sorted according to device types, such as tablet and smartphone, and according to orientation, portrait, and landscape format. Furthermore, the first tile can be configured as the top teaser tile. By default, it is oriented on the top left of the display.

The sections are structured as follows:

Phone

• Portrait
  • Top Teaser Tile
  • Standard Teaser Tile
• Landscape
  • Top Teaser Tile
  • Standard Teaser Tile

Tablet

• Portrait
  • Top Teaser Tile
  • Standard Teaser Tile
• Landscape
  • Top Teaser Tile
  • Standard Teaser Tile

You can specify various options in the individual sections.

• “Teaser width” and “teaser height” describe the minimum size of the respective tile. If the device’s display is wider and cannot accommodate a second tile, the tile will be stretched to the aspect ratio and the image therein will be centered and stretched proportionally. 
  
• “SpanX” and “SpanY“ specify how high and wide the top teaser is in proportion to the standard tile, e.g. “spanX”:2 = two times as wide as the standard tile. 
  
• “Gradient” refers to the colour gradient behind the text of each tile. Each of the numbers is percentage of how high the gradient is over the image and the colour’s transparency at the start and finish. 
  
• “Title“ is the upper text on the tile and matches the title of the issue in Purple DS Manager. 
  
• “Headline” is the lower text on a tile and is taken from the issue description in Purple DS Manager.
  

Note: 

• Tile size is provided in points and not in pixels. 1 px = 0.75 point
  
• The aspect ratio of tile pages and image pages must match; otherwise, the image will be cut with the “Center crop” setting, meaning the image will be centered and then cut according to the tile’s aspect ratio. 
  
• Whenever this document refers to fonts, make sure that these fonts are available are also available in the app in the exact same spelling. Otherwise, a replacement font will be used.