How to Create One Page TYPO3 Site? (Using TypoScript)

Do you want to create one page TYPO3 site? This little TypoScript tutorial will help you to easily create one page TYPO3 site with best backend usability.

How to Create One Page TYPO3 Site? (Using TypoScript)

Do you want to know how to create a one-page TYPO3 Site? (Using TypoScript) This little TypoScript tutorial will help you to easily create one page TYPO3 site with best backend usability.

Step 1. Create menu with #Hash-tag

<!-- At your TypoScript Menu or Fluid DataProcessing Template -->
<a href="#{item.title}">{item.title}</a>

Step 2. Prepare TypoScript Object to Render All Pages

// TypoScript Object to get all pages content
lib.onePageScrollContent = CONTENT
lib.onePageScrollContent {
    table = pages
    select {
        languageField = sys_language_uid
        pidInList = {$ns_basetheme.website.settings.main_menu}
        where = nav_hide = 0
        orderBy = sorting
    }
    renderObj = COA
    renderObj {
        5 = TEXT
        5 {
            field = title
            htmlSpecialChars = 1
            wrap = <section id="|">
            stdWrap.case = lower
            stdWrap.replacement {
                10 {
                    search.char = 32
                    replace.char = 45
                }
                15 {
                    search = /
                    replace = 
                }
            }
        }

        20 = CONTENT
        20 {
            table = tt_content
            select {
                languageField = sys_language_uid
                pidInList.field = uid
                orderBy = sorting
                where = colPos = 0
            }
            stdWrap.wrap = |</section>
            stdWrap.wrap.insertData = 1
        }
    }
}

Step 3. Render TypoScript Object at Fluid Template

// Fluid rendering for home and all pages content
<f:cObject typoscriptObjectPath="lib.content"/>
<f:cObject typoscriptObjectPath="lib.onePageScrollContent"/>

Looking for the Right TYPO3 Products for Your Project?

Explore professional products from T3Planet Shop, including TYPO3 templates, TYPO3 extensions, and AI-powered extensions for modern TYPO3 websites.

  • TYPO3 Templates for flexible and scalable websites
  • TYPO3 Extensions for added features and functionality
  • AI Extensions for content, search, accessibility, localization, and automation
  • Free & Premium products for different TYPO3 project needs
Explore T3Planet Shop
T3Planet Shop TYPO3 Products

Post a Comment

×