The Enterprise News Bundle includes macros like Cover Stories or Corporate News Feed that display an overview over several news items. For those macros to look attractive, you can define teaser information within your blog post.
Up to version 2.2 you had to insert the News Teaser macro. Starting with version 2.3 this macro is deprecated. You will still find it, but it doesn't work anymore and simply gives directions to the new configuration options. We didn't kick it out directly, because we know a lot of news authors are used to it and need some time to adjust. We didn't want admins and project leads to be flooded with "bug reports" about the missing macro
Overall, we are pretty sure nobody will be sad that we got rid of the macro.
Defining news teaser information
Write your news as a blog post just like you are used to it. Maybe you already know the "additional information" panel on top of the editing tools. This is where you set all metadata regarding your blog post: Publish date, sticky state, kicker line ... and starting with version 2.3 it's also the right place to store your news teaser information. Click on the panel or on the button in the footer to open it.
When you open the "additional information" panel there are three tabs. The third tab is what we are interested in here. By default, no special news teaser is defined. You could publish your news like that. Depending on whether the administrator has set a default image, your news would have this default image as a teaser image. If there's nothing defined, the news tile will be of the type "title on color".
To set another type, click one of the options under "Custom".
Choose your teaser type
Title on color
If you choose title on color, you simply select one of two predefined colors. The title of the blog post will be used for this automatically, and it works best with rather short titles.
The image uses the complete available space of the tile. For best results choose image files that are large enough to fill the available space.
If you select the type "Image" you can choose your image file. It doesn't have to be part of the content, but it can be. Clicking the button "Choose image" will open up a dialog where you can select one of the images already attached to the blog post or upload a new one from your computer. You don't have to use an image with exact the right size, just make sure it's large enough. A too small image inside a very large news tile will result in quality loss, because it will be stretched to fill the available space. If your image file is too wide or too high, the Cover Stories macro will make sure it won't be shown larger than the tile is supposed to be.
There is no recommendation for a perfect aspect ratio or image size, because this largely depends on how your Cover Stories are embedded. Each news item can appear in various places: large and small Cover Stories tiles and News Feeds. Therefore Linchpin Enterprise News uses an automatic image cropping and scaling mechanism that determines the most important part of the image and places the image accordingly.
Optional: manual selection of important image areas
The cropping and scaling automatism sometimes runs into problems. In a group of people on a picture it doesn't know which one is the CEO. It has a hard time cropping if you use a very tall picture for a news tile that's very wide. It also doesn't recognize text on an image and might decide to crop half of the last letter away.
For those cases you can adjust the image cropping and define a rectangle around those parts of the image that mustn't be cropped away under any circumstance.
On the right side, where the preview image is displayed, check the option "manual".
There will appear a rectangle on your preview image. Adjust this rectangle by dragging the corners, so it sits around the part of the image you need to be visible at all times.
You'll achieve the best results, if you drag this rectangle as large as necessary, but as small as possible. The more room there is around the image, the better the automatism can adjust for different tile sizes and still fill the hole tile.
The automatic cropping failed in this case.
On the left and right, there are some characters missing.
With the manual setting everything is visible.
Do: Set the important area as small as possible
Do: Set the important area as small as possible. The automatism will still use as much of the image as possible, but it will never crop away the face of the woman on the left.
|Very tall tile
|Very wide tile
|What if we don't set an important area manually?
|Again, a very tall tile. For this example we didn't define the important area manually. The automatism does its thing. And it decided: three faces and a computer, lots of contrast, this must be the central element. This might be okay if you are using stock photos like this one. But if the red haired woman on the left is your CEO, you'll probably want her to be part of the news teaser, right?
|On our square tile we got lucky... barely. Our CEO is part of the image, but still ... she probably won't be happy to be cut off like this.
If all your news tiles are this wide, this image will be fine. Our CEO isn't cropped away, we're all good.
Problem is, you never know where your news will be displayed within your confluence. There might be pages with news macros that don't use the same style as your dashboard, there might be users with different resolutions, they might adjust their browser to a different width. So if your CEO is on a picture, better select her face as important area
Don't: Set a very large important area
Don't: If you define a very large "important area", the image will look awkward inside of news tiles that have a different aspect ratio.
|Very tall tile
|Very wide tile
|This tile is extremely tall. But our selection says: use (almost) the complete width of the image and don't crop anything away. That forces those fat white borders on top and bottom.
|The image isn't square. The news tile is. Because of our selection of a very large important area on the image there isn't enough "breathing room" around the important area to adjust. So we see white borders on top and bottom of the image.
|The selection forces the automatism to use almost the entire image. But the image doesn't fit this very wide aspect ratio. That's why it's forced to put white borders to the left and right of the image.
If you choose a video as news teaser, simply provide the URL to the video. Clicking on the tile will open the video in an overlay.
To show a quote you'll choose the news type Quotation. The quote you use is not identical with the title of the blog post.
- No labels