DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

TypoScript Configuration¶

Include PxSemantic in yout TypoScript Template¶

Please include the static template of PxSemantic either through an include or through the general options.

To include the PxSemantic TS directly in your TS please use the following code:

setup:

<INCLUDE_TYPOSCRIPT: source="FILE:EXT:px_semantic/Configuration/TypoScript/setup.txt">

constants:

<INCLUDE_TYPOSCRIPT: source="FILE:EXT:px_semantic/Configuration/TypoScript/constants.txt">

TypoScript values¶

Use lib.structuredDataMarkup as default TS-Plugin and customize it to your needs.

The following TypoScript values could be configured within the settings section.

TypoScript value	Data type	Description	Default
entity	string	ClassName (namespace syntax!) of the entity which should be filled with data and encoded to JSON-LD	PortrinoPxSemanticSchemaOrgThing
processors	array	Array of processors. Processors which were executed in order of the array keys.
processors.[index].className	string	ClassName of the processor which should be executed
processors.[index].settings	array	Array of options to configure the processor. Settings depend on the processor.

Example - Render Page Information¶

The class Portrino\PxSemantic\Processor\PageProcessor brings you the possibility to embed structured data about the current page into your website as json-ld code. In detail it extracts information like:

title
abstract
starttime
tstamp
author
image (first entry of resources->media collection)

from the current page and adds it to the Portrino\PxSemantic\SchemaOrg\CreativeWork (http://schema.org/CreativeWork).

lib.structuredDataMarkupPageExample < lib.structuredDataMarkup
lib.structuredDataMarkupPageExample {
    settings {
        # classname of the entity (root) which should be rendered
        entity = Portrino\PxSemantic\SchemaOrg\CreativeWork
        processors {
            # Processors should implement Portrino\PxSemantic\Processors\ProcessorInterface
            # Processors will be executed in order of the array keys
            0 {
                className = Portrino\PxSemantic\Processor\PageProcessor
                settings {
                    media {
                        height = 800
                        width = 800
                    }
                }
            }
        }
    }
}

Hint

You can implement your own processors in your extension and add them to the chain of processors. Have a look in the "For Developers" section for this.

Use the TS to render the resulting JSON-LD code somewhere on your website. We put it into the <HEAD> because other meta information are also located within the <HEAD> tag. But it doesn`t matter.

Google says:

"You can embed data in a web page using schema.org field names and the new JSON-LD data format. JSON-LD is easy to" "produce with many widely available JSON encoders. The data, enclosed within the" "<script type="application/ld+json"> ... </script> tags as shown in the examples below, may be placed in either the" "<HEAD> or <BODY> region of the page that displays that event. Either way, it won't affect how your document appears" "in users' web browsers."

—Google Documentation [1]

page.headerData.1453734422 < lib.structuredDataMarkupPageExample

If you want to put it in your template you could make use fluids cObject-ViewHelper:

<f:cObject typoscriptObjectPath="lib.structuredDataMarkupPageExample"></f:cObject>

Result:¶

The result could be look like that. Google and other search engines are now able to understand your data.

<script type="application/ld+json">
    {
      "@context": "http://schema.org/",
      "@type": "CreativeWork",
      "name": "Your Page Title",
      "image": "http://www.example.com/image.jpg",
      "author": {
        "@type":"Person",
        "name":"John Doe"
      },
      "datePublished": "2016-01-25",
      "description": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam"
    }
</script>

Example - Render Corporate Contacts¶

For example you want to markup your official website with information about your corporate contacts (https://developers.google.com/structured-data/customize/contact-points) you can do it this way:

Declare your organization information and corporate contact via TypoScript. We build a special TypoScriptProcessor which could be used to embed information as json-ld.

lib.structuredDataMarkupOrganization < lib.structuredDataMarkup
lib.structuredDataMarkupOrganization {
    settings {
        entity = Portrino\PxSemantic\SchemaOrg\Organization
        processors {
            # processor to set properties of an entity via TypoScript
            0 {
                className = Portrino\PxSemantic\Processor\TypoScriptProcessor
                settings {
                    # for string values you do not have to use TEXT datatype, you can just write "key = value"
                    # US, GB, DE
                    areaServed = DE

                    contactPoint {
                        # "customer support", "technical support", "billing support", ...
                        contactType = customer support
                        telephone = +49-123-456-78
                    }

                    logo {
                        # get the logo image uri via TS and prepend the baseUrl to get the absolute path
                        url = IMG_RESOURCE
                        url {
                            file = fileadmin/company_logo.png
                            stdWrap.wrap = {TSFE:baseUrl}|
                            stdWrap.insertData = 1
                        }
                    }
                    # special datatype from px_semantic EXT to define arrays
                    sameAs = Portrino\PxSemantic\Converter\ArrayConverter
                    sameAs {
                        0 = http://www.facebook.com/yourSite/
                        1 = http://www.youtube.com/user/yourSite/
                        2 = http://www.pinterest.com/yourSite/
                    }
                    # use typolink to generate link to the root page
                    url = TEXT
                    url.typolink {
                        parameter = 1
                        returnLast = url
                    }
                }
            }
        }
    }
}

Result:¶

<script type="application/ld+json">
{
    "@context" : "http://schema.org",
    "@type" : "Organization",
    "areaServed":"DE"
    "url" : "http://www.your-company-site.com",
    "contactPoint" : {
        "@type" : "ContactPoint",
        "areaServed":"DE",
        "telephone" : "+49-123-456-78",
        "contactType" : "customer support"
    },
    "logo": {
        "@type":"ImageObject",
        "url":"http://www.your-company-site.com/fileadmin/company_logo.png"
    },
    "sameAs":[
        "http:\\www.facebook.com\yourSite",
        "http:\\www.youtube.com\user\yourSite",
        "http:\\www.pinterest.com\yourSite\"
    ]
}
</script>

[1]	https://developers.google.com/structured-data/events/performers?rd=1#option_1_add_html_event_markup_directly