# Includes.rst.txt - This file contains includes and substitutions

Usage

This chapter explains how to use DashBash widgets effectively in your TYPO3 backend.

Getting Started

Adding Widgets to Dashboard

  1. Navigate to Dashboard

    • Go to Dashboard in your TYPO3 backend main menu
    • Select an existing dashboard or create a new one by clicking Add Dashboard
  2. Add Widgets

    • Click the Add widget button
    • You'll see two DashBash widgets available:

      • "Number of content elements in the respective languages" (CTypes Widget)
      • "An entertaining brain game for the TYPO3 backend" (Sudoku Widget)
  3. Position and Size

    • Drag widgets to your preferred position
    • Resize widgets using the handles in the bottom-right corner
    • Recommended sizes:

      • CTypes Widget: Large height, Large width
      • Sudoku Widget: Large height, Medium width

CTypes Widget

The CTypes Widget provides comprehensive analysis of content elements across your TYPO3 website.

Basic Usage

Understanding the Display

The widget shows a table with:

  • Content Element Types: All CTypes configured in your TYPO3 installation
  • Language Columns: One column for each configured site language (with flags)
  • Usage Statistics: Number of elements of each type per language
  • Direct Links: Click numbers to jump to content examples
  • Actions Column: Management buttons (when TSConfig filtering is enabled)
CTypes Widget main interface

The CTypes Widget main interface showing content element statistics across languages.

Reading the Statistics

  • Numbers: Show count of active, non-hidden content elements
  • Empty cells: Indicate no content of that type in that language
  • Links: Clicking a number opens the first active element of that type
  • Plugin hierarchy: List-type plugins are shown indented under "list" CType

Advanced Features (TSConfig Filtering)

When TSConfig filtering is enabled, additional management features become available:

TSConfig filtering interface

TSConfig filtering interface for advanced content element management.

Filter Selection

  1. TSConfig Dropdown: Shows different TSConfig configurations found in your page tree
  2. Page Context: Each option shows the page hierarchy where the configuration applies
  3. "All" Option: Shows all content elements without filtering
  4. Automatic Detection: Configurations are automatically discovered and grouped

Show/Hide Deactivated Elements

  • Checkbox Control: Toggle visibility of deactivated content elements
  • Visual Distinction: Deactivated elements shown with different styling
  • State Persistence: Your selection is remembered across sessions

Content Element Management

Content element management buttons

Management buttons for enabling/disabling content elements.

Enable/Disable Content Elements

  1. Action Buttons: Eye icon in the Actions column
  2. Visual States:

    • Green button: Content element is enabled
    • Red button: Content element is disabled
    • Disabled button: Cannot be changed (safety restriction)
  3. Safety Features:

    • Usage Check: Cannot disable content elements that are still in use
    • Plugin Dependencies: Cannot disable "list" while plugins are active
    • Confirmation: Visual feedback after changes
  4. TSConfig Integration: Changes are written to page TSConfig automatically

Bulk Operations

  • Page Selection: Apply changes to specific pages or globally ("all")
  • Immediate Effect: Changes take effect immediately
  • Cache Management: Relevant caches are cleared automatically

Statistics and Analysis

Understanding the Summary

At the bottom of the widget, you'll find summary statistics:

  • Total Content Types: Number of different content element types available
  • Used Content Types: Number of types that actually contain content
  • Could be deactivated: Types with zero usage that can be safely disabled

Performance Insights

Use these statistics to:

  • Optimize Backend UX: Remove unused content elements to simplify editor interface
  • Identify Opportunities: Find content types that could be consolidated
  • Monitor Usage: Track content distribution across languages
  • Plan Cleanup: Identify unused elements for removal

Sudoku Widget

The Sudoku Widget provides an interactive puzzle game within the TYPO3 backend.

Game Basics

Sudoku game interface

Interactive Sudoku game with validation and progress tracking.

Game Rules

Standard Sudoku rules apply:

  • Fill a 9×9 grid with digits 1-9
  • Each row must contain all digits 1-9
  • Each column must contain all digits 1-9
  • Each 3×3 sub-grid must contain all digits 1-9

Interface Elements

  • Fixed Numbers: Pre-filled numbers in bold (cannot be changed)
  • Input Fields: Clickable cells for your entries
  • Validation Colors:

    • Green: Correct entry
    • Red: Incorrect entry
    • White/Default: Empty or not yet validated

Playing the Game

Making Moves

  1. Click any empty cell to select it
  2. Enter a number 1-9 using your keyboard or number pad
  3. Real-time Validation: Cell color changes immediately
  4. Correction: Click incorrect cells to change your entry
  5. Empty Cells: Delete content to clear a cell

Game Features

  • Auto-save: Progress is automatically saved as you play
  • User-specific: Each backend user has their own game state
  • Persistent: Game continues when you return later
  • Responsive: Works on desktop and mobile devices

Completion

Sudoku completion celebration

Congratulations message when puzzle is solved successfully.

When you complete the puzzle:

  • Celebration Message: Animated congratulations overlay
  • Automatic Detection: System detects when puzzle is solved
  • Continue Playing: Message disappears automatically
  • New Game: Use the reset button to start fresh

Game Management

Starting New Games

Sudoku reset button

Reset button for starting new puzzles.

  1. Reset Button: Click the "NEW" button with the star icon
  2. Immediate Reset: New puzzle generates instantly
  3. Difficulty: Puzzles are generated with moderate difficulty (40 pre-filled cells)
  4. Unique Solutions: Each puzzle has exactly one valid solution

Progress Management

  • Session Persistence: Game state survives browser restarts
  • User Isolation: Your progress doesn't affect other users
  • Long-term Storage: Games are stored for up to one year
  • Memory Efficiency: Only current game state is kept in memory

Mobile Usage

Both widgets are optimized for mobile use:

Responsive Design

  • Automatic Scaling: Widgets adapt to screen size
  • Touch-friendly: Buttons and inputs sized for touch interaction
  • Readable Text: Font sizes scale appropriately
  • Scrollable Tables: CTypes Widget table scrolls horizontally on small screens

Mobile-specific Features

CTypes Widget on Mobile:

  • Sticky Headers: Table headers remain visible while scrolling
  • Compact View: Reduced padding and margins for space efficiency
  • Touch Scrolling: Smooth horizontal scrolling for all columns

Sudoku Widget on Mobile:

  • Optimized Grid: Smaller cell size but still touch-friendly
  • Number Input: Mobile keyboards automatically show number pad
  • Zoom Support: Pinch-to-zoom works if needed
  • Portrait/Landscape: Adapts to device orientation

Troubleshooting Usage Issues

Common Issues and Solutions

CTypes Widget Issues

Widget shows "No data available"

  1. Check if you have content elements in your database
  2. Verify site language configuration is correct
  3. Clear all caches: vendor/bin/typo3 cache:flush

CSV export downloads empty file

  1. Check file permissions on /fileadmin/ directory
  2. Verify PHP max_execution_time for large exports
  3. Check browser popup blocker settings

TSConfig filtering not working

  1. Verify enableTsConfigFiltering is set to 1 in extension configuration
  2. Check that you have appropriate page permissions
  3. Ensure TSConfig rules are properly formatted

Sudoku Widget Issues

Game doesn't save progress

  1. Check database connectivity
  2. Verify caching system is working: vendor/bin/typo3 cache:warmup
  3. Clear browser cache and cookies

Numbers don't validate properly

  1. Clear browser cache
  2. Check browser console for JavaScript errors
  3. Verify all JavaScript files are loading correctly

Reset button doesn't work

  1. Check AJAX routes are properly configured
  2. Verify CSRF tokens are working
  3. Check network connectivity and server response

General Widget Issues

Widgets don't appear in dashboard

  1. Verify extension is activated
  2. Check that dashboard system extension is enabled
  3. Clear all caches including browser cache
  4. Check for PHP or JavaScript errors

Styling looks broken

  1. Clear browser cache completely
  2. Check if CSS files are loading (Network tab in browser dev tools)
  3. Verify no conflicting styles from other extensions
  4. Check for Content Security Policy restrictions

Best Practices

Content Management with CTypes Widget

Regular Analysis

  • Weekly Reviews: Check content element usage regularly
  • Before Major Changes: Analyze current state before restructuring
  • After Extensions: Review impact of new extensions on content types
  • Multi-language Sites: Pay attention to language-specific patterns

Cleanup Strategy

  1. Identify Unused: Use statistics to find unused content elements
  2. Check Dependencies: Verify no templates or TypoScript depend on unused types
  3. Test Changes: Use TSConfig filtering to test impact before permanent changes
  4. Document Changes: Keep record of disabled content elements

Team Collaboration

  • Share Dashboards: Create team dashboards with relevant widgets
  • Export Data: Provide CSV exports for content audits
  • Training: Show editors how filtering affects their backend interface

Productive Sudoku Usage

Integration Tips

  • Break Activity: Use during short breaks to refresh focus
  • Team Building: Discuss puzzle strategies with colleagues
  • Stress Relief: Engaging puzzle-solving can reduce work stress
  • Cognitive Exercise: Keep your problem-solving skills sharp

Time Management

  • Set Limits: Don't let games interfere with work productivity
  • Use Timers: Set personal time limits for game sessions
  • Strategic Breaks: Use games during natural workflow breaks

Performance Optimization

Large Sites

For TYPO3 installations with thousands of content elements:

  • Database Optimization: Ensure proper indexing on tt_content table
  • Regular Cleanup: Remove old, deleted content elements permanently
  • Caching Strategy: Use appropriate cache lifetime settings
  • Monitor Performance: Watch query execution times in development

Multi-language Sites

  • Language Strategy: Consider which languages need active monitoring
  • Export Scheduling: Large exports might be better scheduled during off-peak hours
  • Progressive Loading: Consider implementing pagination for very large datasets

Next Steps

Now that you understand how to use DashBash widgets: