Social inputs

Last modified: March 27th, 2024

Working with a specific static site generator?
Customize CloudCannon's documentation to suit your SSG.

Great! We'll show you documentation relevant to .
You can change this any time using the dropdown in the navigation bar.

These inputs are for editing plain text in your data. Each input includes a specific brand icon.

Facebook#

Single line input with a Facebook logo for short text values.

Facebook inputs are shown for inputs configured with the type facebook, or for input keys matching:

  • facebook
  • *_facebook
  • facebook_username
  • *_facebook_username
  • facebook_url
  • *_facebook_url
Screenshot of a two Facebook input. The first input uses a Facebook username, and the second input uses a full URL to a Facebook page as values
Naming convention
copied
facebook: CloudCannon
facebook_username: CloudCannon
facebook_url: https://www.facebook.com/CloudCannon
Naming convention
copied
{
  "facebook": "CloudCannon",
  "facebook_username": "CloudCannon",
  "facebook_url": "https://www.facebook.com/CloudCannon"
}
Naming convention
copied
facebook = "CloudCannon"
facebook_username = "CloudCannon"
facebook_url = "https://www.facebook.com/CloudCannon"
Input configuration
copied
social_handle: CloudCannon
_inputs:
  social_handle:
    type: facebook
Input configuration
copied
{
  "social_handle": "CloudCannon",
  "_inputs": {
    "social_handle": {
      "type": "facebook"
    }
  }
}
Input configuration
copied
social_handle = "CloudCannon"

[_inputs.social_handle]
type = "facebook"

Twitter#

Single line input with a Twitter logo for short text values.

Twitter inputs are shown for inputs configured with the type twitter, or for input keys matching:

  • twitter
  • *_twitter
  • twitter_username
  • *_twitter_username
  • twitter_url
  • *_twitter_url
Screenshot of three Twitter inputs. The first and third inputs use Twitter usernames, while the second input uses a full URL to a Twitter page as values
Naming convention
copied
twitter: CloudCannon
twitter_username: CloudCannon
twitter_url: https://twitter.com/@jekyllrb
Naming convention
copied
{
  "twitter": "CloudCannon",
  "twitter_username": "CloudCannon",
  "twitter_url": "https://twitter.com/@jekyllrb"
}
Naming convention
copied
twitter = "CloudCannon"
twitter_username = "CloudCannon"
twitter_url = "https://twitter.com/@jekyllrb"
Input configuration
copied
social_handle: CloudCannon
_inputs:
  social_handle:
    type: twitter
Input configuration
copied
{
  "social_handle": "CloudCannon",
  "_inputs": {
    "social_handle": {
      "type": "twitter"
    }
  }
}
Input configuration
copied
social_handle = "CloudCannon"

[_inputs.social_handle]
type = "twitter"

Instagram#

Single line input with an Instagram logo for short text values.

Instagram inputs are shown for inputs configured with the type instagram, or for input keys matching:

  • instagram
  • *_instagram
  • instagram_username
  • *_instagram_username
  • instagram_url
  • *_instagram_url
Screenshot of two Instagram inputs. The first input uses a full URL to an Instagram page, and the second input uses the name of an Instagram handle as the value
Naming convention
copied
instagram: purenewzealand
instagram_username: purenewzealand
instagram_url: https://www.instagram.com/purenewzealand/
Naming convention
copied
{
  "instagram": "purenewzealand",
  "instagram_username": "purenewzealand",
  "instagram_url": "https://www.instagram.com/purenewzealand/"
}
Naming convention
copied
instagram = "purenewzealand"
instagram_username = "purenewzealand"
instagram_url = "https://www.instagram.com/purenewzealand/"
Input configuration
copied
social_handle: CloudCannon
_inputs:
  social_handle:
    type: instagram
Input configuration
copied
{
  "social_handle": "CloudCannon",
  "_inputs": {
    "social_handle": {
      "type": "instagram"
    }
  }
}
Input configuration
copied
social_handle = "CloudCannon"

[_inputs.social_handle]
type = "instagram"

GitHub#

Single line input with a GitHub logo for short text values.

GitHub inputs are shown for inputs configured with the type github, or for input keys matching:

  • github
  • *_github
  • github_username
  • *_github_username
  • github_url
  • *_github_url
Screenshot of three GitHub username inputs. The first input uses a GitHub username, the second input uses a full URL to a GitHub user, and the third input uses a full URL to a GitHub repository as values
Naming convention
copied
github: CloudCannon
github_username: CloudCannon
github_url: https://github.com/jekyll
docs_github_url: https://github.com/CloudCannon/Documentation
Naming convention
copied
{
  "github": "CloudCannon",
  "github_username": "CloudCannon",
  "github_url": "https://github.com/jekyll",
  "docs_github_url": "https://github.com/CloudCannon/Documentation"
}
Naming convention
copied
github = "CloudCannon"
github_username = "CloudCannon"
github_url = "https://github.com/jekyll"
docs_github_url = "https://github.com/CloudCannon/Documentation"
Input configuration
copied
social_handle: CloudCannon
_inputs:
  social_handle:
    type: github
Input configuration
copied
{
  "social_handle": "CloudCannon",
  "_inputs": {
    "social_handle": {
      "type": "github"
    }
  }
}
Input configuration
copied
social_handle = "CloudCannon"

[_inputs.social_handle]
type = "github"

Pinterest#

Single line input with a Pinterest logo for short text values.

Pinterest inputs are shown for inputs configured with the type pinterest, or for input keys matching:

  • pinterest
  • *_pinterest
  • pinterest_username
  • *_pinterest_username
  • pinterest_url
  • *_pinterest_url
Screenshot of three Pinterest inputs. The first and second inputs use a Pinterest username, and the third input uses a full URL to Pinterest user
Naming convention
copied
pinterest: pinterest
default_pinterest: pinterest
pinterest_url: https://www.pinterest.com/pinterest/
Naming convention
copied
{
  "pinterest": "pinterest",
  "default_pinterest": "pinterest",
  "pinterest_url": "https://www.pinterest.com/pinterest/"
}
Naming convention
copied
pinterest = "pinterest"
default_pinterest = "pinterest"
pinterest_url = "https://www.pinterest.com/pinterest/"
Input configuration
copied
social_handle: CloudCannon
_inputs:
  social_handle:
    type: pinterest
Input configuration
copied
{
  "social_handle": "CloudCannon",
  "_inputs": {
    "social_handle": {
      "type": "pinterest"
    }
  }
}
Input configuration
copied
social_handle = "CloudCannon"

[_inputs.social_handle]
type = "pinterest"

Options#

Social inputs have the following available options:

empty_type - string#

Set how an ‘empty’ value will be saved. Does not apply to existing empty values. Can be one of the following:

  • string - an empty value for this input will be stored as "".
  • null - an empty value for this input will be stored as a null value (default). This does not apply to TOML files.

Valid values#

Documented below are the valid formats for facebook, twitter, instagram, github, and pinterest inputs.

The lists of examples are non-exhaustive.

Empty/null value:

  • social:

Any valid string (quoted or unquoted):

  • social: ""
  • social: ''
  • social: twitter.com/CloudCannon
  • social: "twitter.com/CloudCannon"
  • social: 'twitter.com/CloudCannon'
  • social: "https://twitter.com/CloudCannon"

Social URLs containing : must be surrounded by quotes

Any valid string:

  • social = ""
  • social = ''
  • social = "twitter.com/CloudCannon"
  • social = 'twitter.com/CloudCannon'
  • social = "https://twitter.com/CloudCannon"

Null value:

  • "social": null

Any valid string:

  • "social": ""
  • "social": "twitter.com/CloudCannon"
  • "social": "https://twitter.com/CloudCannon"
Previous
Date and Time inputs
These inputs are for editing date and time values in your data.
Next
Object inputs
Object inputs in your data show as a button in the data editor. This button opens a new editor to the side, showing the inputs inside that object. This continues as you click into nested object inputs. Each object level has a back button to return to the parent scope.
Open in a new tab