Publishing a Longform Story on theday.com#

REQUIREMENTS

  • Story must have a main image; the main image needs to be exactly 1560 x 850 pixels. Make sure it's web resolution (72dpi); if it's print resolution (200 to 300 dpi) it will take forever to load.
  • Subsequent images will be loaded outside the NCS Content system; see below for more info.
  • Story should have multiple discrete chapters

Create a story as you normally would in NCS Content. Add the main image to the story as you normally would. If story is to be divided up into chapters, see next step. In the web properties tab, do the following:

  • make sure the Article design drop-down is set to A Longform Story;
  • add relevent taxonomy in Taxonomies;
  • And, if the story is chaptered, add the relevant HTML to the CustomHTML field

FIG. 1 -- Select the 'A Longform story' design class from the Article design dropdown. Also, paste the chapter html into the CustomHTML box. FIG. 1 -- Select the 'A Longform story' design class from the Article design dropdown. Also, paste the chapter html into the CustomHTML box.

To create a multiple-chapter story, enter your intro as normal in the story text box in NCS Content. For a new chapter, click the icon at the bottom of the current text box, as illustrated in Fig. 2, below. Do this for any and all subsequent chapters. Five (5) chapters is currently the maximum number of chapters we can do.

FIG. 2 -- Add chapters -- paragraphs in NCS Content parlance -- corresponding the number of chapters. FIG. 2 -- Add chapters (paragraphs in NCS Content parlance) corresponding the number of chapters.

IMAGES

Images must be at least 1000 pixels wide; name your image something that makes sense and include the date in the name. Something like immigration_day01_07-05-2017.jpg is much better than dayphoto.jpg; use underscores or dashes to separate words in the image filename. Spaces are a no-no.

Upload images via FTP to here: /DAY-NL-Assets/img/news2017/

The path to your image if it's named immigration_day01_07-05-2017.jpg will be: /Assets/img/news2017/immigration_day01_07-05-2017.jpg

To insert an image, open the HTML editor in the chapter you want to add the image to and scroll to the spot in the text where you'd like the image to appear. Paste this code, replacing the image name, alt text and caption with the relevant correct info.

    <div class="img-cont">
    <img class="img-responsive" src="/Assets/img/news2017/YOUR-IMAGE.jpg" alt="Alt text goes here" />
    </div>
    <div class="photo-info-cont">
    <span class="photocapt">Photo caption goes here</span>
    </div>

To insert a pull quote, again open the HTML editor in the relevant chapter and scroll to where you'd like the quote to appear, and paste this code in, again replacing the dummy text with the real quote:

```<blockquote class="pq">Pull quote text goes here ...</blockquote>```

CHAPTER MARKERS/NAVIGATION

If the story has a single "chapter", you don't need to add chapter navigation. Two or more chapters will trigger chapter navigation and you need to add HTML code to the CustomHTML field. Each chapter marker/nav item is an HTML line item (li). It should look like this:

    <li><a href="#chapter1">Start</a></li>
    <li><a href="#chapter2">1</a></li>
    <li><a href="#chapter3">2</a></li>
    <li><a href="#chapter4">3</a></li>

NOTE that chapter1 is labeled START, chapter 2 is labeled 1, chapter 3 is labeled 2, etc.

Add or delete chapters as dictated by the number of story chapter blocks.