NodeTypes.yaml

'AdSy.website2:TeamMember':
  superTypes:
    - 'TYPO3.Neos:Content'
  ui:
    group: 'general'
    icon: 'icon-map-marker'
    label: 'Team Member'
    inlineEditable: TRUE
    inspector:
      groups:
        TeamMember:
          label: 'Team Member'
  properties:
    name:
      type: string
      defaultValue: 'Test Haaans!'
      ui:
        label: 'Name'
        inlineEditable: TRUE
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    'image':
      type: 'TYPO3\Media\Domain\Model\ImageInterface'
      ui:
        label: 'Image'
        reloadIfChanged: TRUE
        inlineEditable: TRUE
        inspector:
          group: 'TeamMember'
          editorOptions:
            crop:
              aspectRatio:
                locked:
                  width: 1
                  height: 1
    claim:
      type: string
      ui:
        label: 'Claim'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    text:
      type: string
      ui:
        label: 'Text'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    quote:
      type: string
      ui:
        label: 'Quote'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    facebook:
      type: string
      ui:
        label: 'Facebook'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    linkedin:
      type: string
      ui:
        label: 'Linkedin'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    twitter:
      type: string
      ui:
        label: 'Twitter'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    xing:
      type: string
      ui:
        label: 'Xing'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'
    github:
      type: string
      ui:
        label: 'GitHub'
        reloadIfChanged: TRUE
        inspector:
          group: 'TeamMember'

TeamMember.html

{namespace neos=TYPO3\Neos\ViewHelpers}
{namespace ts=TYPO3\TypoScript\ViewHelpers}

<div{attributes -> f:format.raw()}>
    <div class="team-member container">
      <div class="team-member-portrait">
        <img class="team-member-image" src="{image}">
        <div class="team-member-quote">
          <blockquote>
            {neos:contentElement.editable(property: 'quote')}
          </blockquote>
        </div>
      </div>
      <div class="team-member-content">
        <div class="team-member-description">
          <h1 class="team-member-name">{neos:contentElement.editable(property: 'name')}</h1>
          <h2 class="team-member-title">{neos:contentElement.editable(property: 'claim')}</h2>
          <p>
            {neos:contentElement.editable(property: 'claim')}
          </p>
        </div>
        <div class="team-member-social">
          <ul>
            <li><a href="#"><i class="fa fa-facebook"></i></a></li>
            <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
            <li><a href="#"><i class="fa fa-twitter"></i></a></li>
            <li><a href="#"><i class="fa fa-xing"></i></a></li>
            <li><a href="#"><i class="fa fa-github"></i></a></li>
          </ul>
        </div>
      </div>
  </div>
</div>

TeamMember.ts2

prototype(AdSy.website2:TeamMember) < prototype(TYPO3.TypoScript:Template) {

     templatePath = 'resource://AdSy.website2/Private/Templates/TypoScriptObjects/TeamMember.html'
     
		 node = ${node}
     name = ${q(node).property('name')}
     image = ${q(node).property('image')}
     claim = ${q(node).property('claim')}
     text = ${q(node).property('text')}
     quote = ${q(node).property('quote')}
     facebook = ${q(node).property('facebook')}
     linkedin = ${q(node).property('linkedin')}
     twitter = ${q(node).property('twitter')}
     xing = ${q(node).property('xing')}
		 github = ${q(node).property('github')}
}