Introduction Of Salesforce

Some Information here

As a kid, didn’t you love listening to ghost stories while sitting around a campfire? Some were lame, like Casper; some were kinda’ cool, like Bloody Mary; and some were just downright weird, like Shirime (yeah... I’ll let you look that one up yourself).

All these stories had one thing in common: they connected the listeners, even if for just a brief period of time.

But today, I’m going to use my Ghost demo to teach you how to connect with your readers for a long time. And to do that, we won’t be focused on stories about ghosts (don’t worry, those will be in there too) because we’ll actually be using the ghost itself.

Ghost CMS, that is.

Plus, in keeping with the spooky vibe of this post, let’s make that a Ghost gone headless. More specifically, in this article I am going to:

• Provide a brief history of Ghost CMS
• Explain why Ghost is a great tool for bloggers
• Discuss the benefits of using Ghost as a headless CMS
• Introduce you to making your Ghost site
• Create an automated content e-mail to keep your readers in the loop

But first things first, let’s get caught up on exactly what Ghost CMS is.

A brief history of Ghost CMS…

Ghost is a free, open-source platform designed with one thing in mind: minimalistic content publishing. In other words, Ghost is made for bloggers. Period. In fact, it was the brain-child of a former WordPress employee, John O’Nolan, so it’s no surprise that blogging stays fixed at this platform’s core.

O’Nolan worked with fellow coder Hannah Wolfe to create Ghost back in 2013 after getting frustrated with WordPress (and it is just me or have we been hearing that a lot in the last five years?). This probably doesn’t surprise you as Ghost is commonly touted as a sleeker WP alternative.

The overall goal was to create a platform that was simple, lean, and modern. Something with all the good parts of WordPress without being over-bloated. But the best description of Ghost comes from O’Nolan’s own words: it’s “just a blogging website.”

And it’s directly in that simplicity where Ghost’s force lies.

What makes Ghost CMS a great tool for bloggers?

https://www.datocms-assets.com/48401/1627664365-fast-typing.webm

Apart from its headless capabilities (which we will get into soon), one of the most obvious benefits of Ghost is its leanness. Instead of taking the shotgun approach like some CMSs which try to hit everything, Ghost can be thought of more like a sharpshooter. It’s designed for a specific task—publishing content—and it performs that task really, really effectively.

But before you get the wrong idea that Ghost sites are all plain, think again. Yes, the goal is to get content out to your readers, but there are plenty of pre-built themes to ensure your audience is aesthetically pleased as well. You can also customize their out-of-the-box theme by writing some Handlebars.js code.

And then there’s the SEO optimization which is pretty much a “must have” in the blogging world at this point. The Ghost site itself lays out a few of the key SEO features that come built-in:

There are built-in XML sitemaps, Google AMP pages, canonical tags, optimised URLs, microformats, Facebook Open Graph tags, support for Twitter cards and clean semantic markup. All of this is done for you automatically, with no plugins needed.

Finally, it’s super fast. O’Nolan and Wolfe built Ghost on Node.js (which we love) so as you would expect, it runs with lightning quick speed.

Now that we’ve gotten that out of the way, let’s take this one step further and chop this Ghost’s head clean off.

Using Ghost as a headless CMS

If this isn’t the first time you’re reading through our blog, then you may have noticed we love the JAMstack. A lot. Part of the reason is that we see a ton of value in CMSs going headless (which we’ll explain a bit more below).

And we’ll be (kinda) doing that here in our Ghost demo. Let me explain…

The original version of Ghost functioned in the classic monolithic style, as you’d probably expect. But in an effort to keep up with the times—a successful effort, btw—Ghost became headless by design. Ghost’s core is a RESTful JSON API which works well with the default frontend (monolithic) but can be accessed from the outside as well (headless). The bottom line? Ghost now fits (quite nicely) on the JAMstack.

Using Ghost as a headless CMS offers some major benefits:

• More flexibility: When you have specific needs that go beyond just rendering content in a web page, headless is the key.
• Faster Distribution and Lower Cost: Going headless makes it incredibly easy to generate a static site that can be globally distributed using a platform like Netlify. As a happy bonus, having the freedom to host and deploy your static site with Netlify (or a similar product) lets you do things on the cheap. It’s amazing how far you can get for free with open source services. :)

For our purposes, we’re going the ol’ monolithic approach for the landing page, but will go headless for the weekly content update newsletter in our Ghost demo. Here’s how:

First, we’ll create our Ghost site and customize the Handlebar’s template. That’s the monolithic (boring) part. Now let’s get headless.

We will be using their experimental (yet very stable) "Subscribers" feature. In their docs, Ghost makes it clear that “Email addresses can be viewed and edited from Ghost admin, but no emails will be sent without further integrations with an email tool.”

So, that’s precisely what we’ll be doing here: creating a custom email tool that works by extending this feature.

Then we will use their APIs both to retrieve posts to bundle into each newsletter and to retrieve subscribers who will receive the newsletter.

The stack we are going to use to make this newsletter happen is a Ghost site with a bit of custom templating, and a small scheduling and webhook workflow built on top of AWS Lambda.

Let's get started!

1. Starting up your Ghost blog

I won't go to great length on how to install and host a Ghost site. Their team has it well covered in their neat documentation site.

Whether you go fully managed with Ghost Pro, or boot your own using Ghost-CLI, you'll see that getting started with Ghost is dead easy (pun intended).

I personally used this starter repo that allows you to quickly spin up a fresh Ghost instance in a free Azure hosting environment in no time.

Once your site is live, complete the initial setup screens to create your account and invite your content editors to create theirs. Once logged in, I recommend you take a look at the sample content under the "Getting Started" tag. It lays out the most commonly used features in a quite friendly form.

This tutorial will build on top of Ghost's default template, Casper.

2. Enable Subscribers feature

A key piece of your newsletter setup will be to let people subscribe to your scary content. Ghost now offers a "Subscribers" feature. At the time of writing, this feature is marked as "Experimental". You can enable it under the "Labs" section of the Ghost admin:

/ghost/#/settings/labs

3. Create a custom content structure

There will be 3 kinds of content node in our Ghost demo for now:

• The landing page
• The welcome email
• Ghost stories

But we have to configure some routes first, to serve custom Handlebars templates.

Ghost comes with some routes baked in the default install. Let's customize them to our needs

# ./content/settings/routes.yaml

routes:

  # This is the root route.
  # Data context mapped to the page with the slug 'landing'
  /:
    data: page.landing
    template: landing

  # This is the route used to generate the welcome email HTML.
  # Data context mapped to the page with the slug 'nl-welcome-email'
  /nl-welcome-email/:
    data: page.nl-welcome-email
    template: nl-welcome-email

collections:

  # This is the route used to generate the weekly email HTML.
  /nl-stories-email/:
    permalink: /stories/{slug}/
    template: nl-stories-email

Configuring custom routes in Ghost is easy and flexible. It's important to note that if your site is hosted on Ghost Pro, you still have the ability to upload custom routes under Settings >> Labs

3.1 Create the landing page

Since the site will only feature a weekly newsletter for now, let's create a minimal template that will call people to subscribe.

Just create the landing.hbs file under ./content/themes/casper/.

{{!< default}}

<header id="landing-header" class="site-header outer">
    {{> "site-nav"}}
</header>

{{#page}}

<main id="site-main" class="site-main outer">
    <div class="inner">

        <article class="post-full {{post_class}}">

            <header class="post-full-header">
                <section class="post-full-meta">
                </section>
                <h1 class="post-full-title">{{title}}</h1>
            </header>

            <section class="post-full-content">
                <div class="post-content" style="padding-bottom:70px;">
                    {{content}}
                    <a href="#subscribe">Stay up to date!</a>
                </div>
            </section>

        </article>

    </div>
</main>
{{/page}}

The Casper theme features a nice "Subscribe" modal overlay. You can trigger it by navigating to the #subscribe anchor.

The landing page content node will be created as a Page since it is not part of any content collection, like Posts do.

Create a new page, and don't forget to publish it. Make sure the page's slug (called "Page URL" in the UI) is set to landing. It's important because we have some routing rules in place that rely on it.