Coded Options Page

// 1️⃣ Admin Menüpunkt für die globale Einstellungsseite hinzufügen

function my_custom_global_settings() {

    add_menu_page(

        'Globale Einstellungen', // Seitentitel

        'Globale Daten', // Menüpunkt-Name

        'manage_options', // Berechtigung

        'global-settings', // Slug

        'my_global_settings_page', // Callback-Funktion

        'dashicons-admin-generic', // Icon

        80 // Position im Menü

    );

}

add_action('admin_menu', 'my_custom_global_settings');

// 2️⃣ Inhalt der Einstellungsseite mit Shortcodes & Formatierung

function my_global_settings_page() {

    ?>

    <div class="wrap">

        <h1>Globale Firmendaten</h1>

        <form method="post" action="options.php">

            <?php

            settings_fields('global_options_group');

            do_settings_sections('global-settings');

            submit_button();

            ?>

        </form>

        <h2>Shortcodes für Breakdance</h2>

        <p>Kopiere die gewünschten Shortcodes und füge sie in Breakdance ein:</p>

        <div style="padding:10px 0;">

            <strong>Telefonnummer:</strong> <code>[company_phone]</code><br>

            <strong>Telefon-Link:</strong> <code>[company_phone_link]</code>

        </div>

        <hr style="border-top: 1px solid #ccc; margin: 15px 0;">

        <div style="padding:10px 0;">

            <strong>E-Mail:</strong> <code>[company_email]</code><br>

            <strong>E-Mail-Link:</strong> <code>[company_email_link]</code>

        </div>

        <hr style="border-top: 1px solid #ccc; margin: 15px 0;">

        <div style="padding:10px 0;">

            <strong>Adresse:</strong> <code>[company_address]</code><br>

            <strong>Adresse-Link:</strong> <code>[company_address_link]</code>

        </div>

        <hr style="border-top: 1px solid #ccc; margin: 15px 0;">

        <div style="padding:10px 0;">

            <strong>Logo:</strong> <code>[company_logo]</code><br>

            <strong>Logo (weiß):</strong> <code>[company_logo_white]</code>

        </div>

    </div>

    <?php

}

// 3️⃣ Globale Optionen registrieren

function my_custom_settings_init() {

    register_setting('global_options_group', 'company_phone');

    register_setting('global_options_group', 'company_phone_link');

    register_setting('global_options_group', 'company_email');

    register_setting('global_options_group', 'company_email_link');

    register_setting('global_options_group', 'company_address');

    register_setting('global_options_group', 'company_address_link');

    register_setting('global_options_group', 'company_logo');

    register_setting('global_options_group', 'company_logo_white');

    add_settings_section('global_section', 'Firmendaten', null, 'global-settings');

    add_settings_field('company_phone', 'Telefonnummer:', function() {

        echo '<input type="text" name="company_phone" value="' . esc_attr(get_option('company_phone')) . '" />';

    }, 'global-settings', 'global_section');

    add_settings_field('company_phone_link', 'Telefon-Link:', function() {

        echo '<input type="text" name="company_phone_link" value="' . esc_attr(get_option('company_phone_link')) . '" />';

        echo '<hr style="border-top: 1px solid #ccc; margin: 15px 0;">';

    }, 'global-settings', 'global_section');

    add_settings_field('company_email', 'E-Mail:', function() {

        echo '<input type="email" name="company_email" value="' . esc_attr(get_option('company_email')) . '" />';

    }, 'global-settings', 'global_section');

    add_settings_field('company_email_link', 'E-Mail-Link:', function() {

        echo '<input type="text" name="company_email_link" value="' . esc_attr(get_option('company_email_link')) . '" />';

        echo '<hr style="border-top: 1px solid #ccc; margin: 15px 0;">';

    }, 'global-settings', 'global_section');

    add_settings_field('company_address', 'Adresse:', function() {

        echo '<input type="text" name="company_address" value="' . esc_attr(get_option('company_address')) . '" />';

    }, 'global-settings', 'global_section');

    add_settings_field('company_address_link', 'Adresse-Link:', function() {

        echo '<input type="text" name="company_address_link" value="' . esc_attr(get_option('company_address_link')) . '" />';

        echo '<hr style="border-top: 1px solid #ccc; margin: 15px 0;">';

    }, 'global-settings', 'global_section');

    add_settings_field('company_logo', 'Logo:', function() {

        $logo = get_option('company_logo');

        echo '<input type="hidden" id="company_logo" name="company_logo" value="' . esc_attr($logo) . '" />';

        echo '<button type="button" class="button upload-logo" data-target="company_logo" data-preview="logo_preview" style="display: block; margin-bottom: 10px;">Bild auswählen</button>';

        echo '<div id="logo_preview" style="background-color: white; padding: 10px; display: inline-block; margin-top: 10px; border: 1px solid #ddd;">' 

            . ($logo ? '<img src="' . esc_url($logo) . '" width="150" />' : '') 

            . '</div>';

    }, 'global-settings', 'global_section');

    add_settings_field('company_logo_white', 'Logo (weiß):', function() {

        $logo = get_option('company_logo_white');

        echo '<input type="hidden" id="company_logo_white" name="company_logo_white" value="' . esc_attr($logo) . '" />';

        echo '<button type="button" class="button upload-logo" data-target="company_logo_white" data-preview="logo_white_preview" style="display: block; margin-bottom: 10px;">Bild auswählen</button>';

        echo '<div id="logo_white_preview" style="background-color: black; padding: 10px; display: inline-block; margin-top: 10px;">' 

            . ($logo ? '<img src="' . esc_url($logo) . '" width="150" />' : '') 

            . '</div>';

    }, 'global-settings', 'global_section');

}

add_action('admin_init', 'my_custom_settings_init');

// 4️⃣ Fix für "Bild auswählen"-Button – Media Uploader korrekt laden

function load_wp_media_files($hook) {

    if ($hook !== 'toplevel_page_global-settings') {

        return;

    }

    wp_enqueue_media();

}

add_action('admin_enqueue_scripts', 'load_wp_media_files');

function custom_media_script() {

    ?>

    <script>

    jQuery(document).ready(function($) {

        $('.upload-logo').click(function(e) {

            e.preventDefault();

            var button = $(this);

            var mediaUploader;

            var targetInput = $('#' + button.data('target'));

            var previewDiv = $('#' + button.data('preview'));

            mediaUploader = wp.media({

                title: 'Bild auswählen',

                button: { text: 'Bild auswählen' },

                multiple: false

            });

            mediaUploader.on('select', function() {

                var attachment = mediaUploader.state().get('selection').first().toJSON();

                targetInput.val(attachment.url);

                previewDiv.html('<img src="' + attachment.url + '" width="150" />');

            });

            mediaUploader.open();

        });

    });

    </script>

    <?php

}

add_action('admin_footer', 'custom_media_script');

// 5️⃣ Shortcodes für Breakdance erstellen

function company_phone_shortcode() {

    return esc_html(get_option('company_phone', '+43 123 456 789'));

}

add_shortcode('company_phone', 'company_phone_shortcode');

function company_phone_link_shortcode() {

    return esc_url(get_option('company_phone_link', 'tel:+43123456789'));

}

add_shortcode('company_phone_link', 'company_phone_link_shortcode');

function company_email_shortcode() {

    return esc_html(get_option('company_email', '[email protected]'));

}

add_shortcode('company_email', 'company_email_shortcode');

function company_email_link_shortcode() {

    return esc_url('mailto:' . get_option('company_email', '[email protected]'));

}

add_shortcode('company_email_link', 'company_email_link_shortcode');

function company_address_shortcode() {

    return esc_html(get_option('company_address', 'Musterstraße 123, 1010 Wien'));

}

add_shortcode('company_address', 'company_address_shortcode');

function company_address_link_shortcode() {

    return esc_url(get_option('company_address_link', '#'));

}

add_shortcode('company_address_link', 'company_address_link_shortcode');

function company_logo_shortcode() {

    $logo_url = get_option('company_logo', '');

    if ($logo_url) {

        return '<img src="' . esc_url($logo_url) . '" alt="Firmenlogo">';

    }

    return '';

}

add_shortcode('company_logo', 'company_logo_shortcode');

function company_logo_white_shortcode() {

    $logo_url = get_option('company_logo_white', '');

    if ($logo_url) {

        return '<img src="' . esc_url($logo_url) . '" alt="Firmenlogo Weiß">';

    }

    return '';

}

add_shortcode('company_logo_white', 'company_logo_white_shortcode');