Support » Allgemeine Fragen » Unteres Menü bei mobiler Ansicht.

  • Moin. Bin totaler Anfänger und erstelle gerade eine Seite. Ich habe auf der Seite https://www.forsthaus-auerhahn.de/ gesehen, das in der mobilen Ansicht unten ein Menü fix angeheftet ist. (Anfrage/Buchen) Ich finde aber nirgends einen Hinweis oder eine Erklärung/Anleitung wie das realisiert werden kann. Hat jemand einen Tip wonach ich suchen kann?

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 9 Antworten - 1 bis 9 (von insgesamt 9)
  • Hallo,
    zunächst: Die genannte Website wurde nicht mir WordPress erstellt.
    Das wirst du wohl mit einem Gruppen-Block im Footer realisieren können, der angeheftet (sticky) ist. Entweder bei einem klassischen Theme wie z. B. GeneratePress über Design > Customizer und da Bearbeitung des Footers oder bei einem Block Theme wie das aktuelle Standardtheme Twenty Twenty-Four im Template-Part für den Footer.

    Wenn du uns verrätst, welches Theme du einsetzt, kann ich dir ggfs. einen Screenshot hier posten.

    Viele Grüße
    Hans-Gerd

    Thread-Starter lilbigjim

    (@lilbigjim)

    Moin Hans-Gerd,

    das Theme heisst Hoteller. Versuche gerade rückwarts zu verstehen wie die Dinge angelegt sind. Ist aber noch ein sehr weiter Weg….

    Über ein Screenshot und jegliche Hinweise, Tips wäre ich sehr dankbar.

    Hallo,
    da das Theme kostenpflichtig ist, können wir dir da wohl kaum helfen.

    Um das grundsätzlich mal deutlich zu machen, zeige ich das mit dem Standardtheme Twenty Twenty als Beispiel, wobei hier sicher noch Optimierungsmöglichkeiten wären.

    Über Design > Customizer > Zusätzliches CSS habe ich die folgende CSS-Regel erfasst:

    @media (max-width: 720px) {
    .footer-widgets-wrapper {
        position: fixed;
        bottom: 0;
        right: 0;
        width: 100%;
        justify-content: center;
        background-color: antiquewhite;
    }

    Bei deinem Theme wird die Klasse (hier .footer-widgets-wrapper) sicher anders benannt sein. Dam musst du ggfs. Kontakt mit den Entwicklern aufnehmen. Über die developer console kannst du das aber auch ermitteln. Die Media Query sorgt dafür, dass nur bei Geräten bis zu einer Breite von 720px der Footer so fixiert wird.

    Der Screenshot zeigt den Footer, der sich ähnlich wie der Footer bei der genannten Website verhält (bei Klick auf das Bild, wird das Bild vergrößert):

    Screenshot Footer.

    Viele Grüße
    Hans-Gerd

    • Diese Antwort wurde geändert vor 2 Monaten, 2 Wochen von Hans-Gerd Gerhards. Grund: Tippfehler
    Thread-Starter lilbigjim

    (@lilbigjim)

    Also aktuell habe ich das nur grundsätzlich verstanden. Ich teste das mal morgen früh und berichte über mein vermutliches scheitern…..

    Danke erstmal für die Hilfestellung.

    Hallo,
    wenn du die URL oben einträgst, dann können wir uns das auch zunächst im Frontend ansehen und dir sicher besser helfen.

    Lies doch bitte mal: Bevor du ein neues Thema (Thread) erstellst.

    Hilfreich für eine Analyse wäre auch der Website-Bericht:
    Du findest unter Werkzeuge > Websitezustand > Info einen Bericht zur Website. Warte bitte einen Moment bis die Ladeanzeige ganz oben abgeschlossen ist und kopiere dann per Button den Website-Bericht in deine Zwischenablage. Über den Button „Bericht in die Zwischenablage kopieren“ kannst du den Bericht unverändert (bitte mit den Akzentzeichen am Anfang und Ende) einfügen und anschließend hier posten. Evtl. ergeben sich dann weitere Anhaltspunkte, ob und wo das Problem liegt.
    Hier ein Screenshot dazu (bei Klick auf das Bild, wird das Bild vergrößert):
    Website-Bericht

    Und mit z. B. STRG V in die Antwort bei diesem Thema einfügen.

    Viele Grüße
    Hans-Gerd

    Thread-Starter lilbigjim

    (@lilbigjim)

    Bitte bei dem Bericht nicht „schimpfen“. Ich komme aus dem IT Securitybereich und versuche aktuell durch reverse engineering WordPress zu verstehen. Klappt nur so suboptimal, die Laune ist aber noch gut. Die Lernkurve flach…..

    Hier die URL: https://hotelgruenberger.de/interim

    Hier der Webseitenbericht:

    ` wp-core
    
    version: 6.4.3
    site_language: de_DE
    user_language: de_DE
    timezone: Europe/Berlin
    permalink: /archive/%post_id%
    https_status: true
    multisite: false
    user_registration: 0
    blog_public: 1
    default_comment_status: open
    environment_type: production
    user_count: 1
    dotorg_communication: true wp-paths-sizes wordpress_path: /home/u392871807/domains/hotelgruenberger.de/public_html
    wordpress_size: 62,55 MB (65590543 bytes)
    uploads_path: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content/uploads
    uploads_size: 12,99 MB (13617041 bytes)
    themes_path: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content/themes
    themes_size: 10,65 MB (11162419 bytes)
    plugins_path: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content/plugins
    plugins_size: 240,72 MB (252414375 bytes)
    database_size: 66,88 MB (70123520 bytes)
    total_size: 393,78 MB (412907898 bytes) wp-dropins (1) object-cache.php: true wp-active-theme name: Hoteller (hoteller)
    version: 6.5.9
    author: ThemeGoods
    author_website: https://themeforest.net/user/ThemeGoods
    parent_theme: none
    theme_features: core-block-patterns, title-tag, post-thumbnails, automatic-feed-links, custom-background, post-formats, widgets-block-editor, woocommerce, widgets, menus
    theme_path: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content/themes/hoteller wp-themes-inactive (1) Aravalli: version: 7.1, author: Nayra Themes wp-mu-plugins (1) Disable Auto Updates: author: (undefined), version: (undefined) wp-plugins-active (35) All in One SEO: version: 4.5.7.3, author: All in One SEO Team
    Classic Widgets: version: 0.3, author: WordPress Contributors
    Clever Fox: version: 24.6, author: nayrathemes (latest version: 24.7)
    Click to Chat: version: 3.33, author: HoliThemes (latest version: 3.34)
    Complianz | GDPR/CCPA Cookie Consent: version: 7.0.2, author: Really Simple Plugins
    Contact Form 7: version: 5.9, author: Takayuki Miyoshi
    Custom Fonts: version: 2.1.3, author: Brainstorm Force
    Duplicate Page: version: 4.5.3, author: mndpsingh287
    Elementor: version: 3.19.4, author: Elementor.com
    Elementor Google Map Extended: version: 1.2.3, author: InternetCSS
    Elementor Header & Footer Builder: version: 1.6.25, author: Brainstorm Force, Nikhil Chavan
    Elementor Pro: version: 3.19.3, author: Elementor.com
    Envato Market: version: 2.0.11, author: Envato
    Google Analytics for WordPress by MonsterInsights: version: 8.24.0, author: MonsterInsights
    Head, Footer and Post Injections: version: 3.2.7, author: Stefano Lissa
    Hostinger: version: 2.0.9, author: Hostinger
    Hostinger AI Assistant: version: 1.6.9, author: Hostinger
    Hotel Booking: version: 4.8.8, author: MotoPress
    Hotel Booking & Mailchimp Integration: version: 1.0.2, author: MotoPress
    Hotel Booking Checkout Fields: version: 1.2.1, author: MotoPress
    Hotel Booking Multi-Currency: version: 1.2.5, author: MotoPress
    Hotel Booking Notifier - Event-driven emails: version: 1.3.2, author: MotoPress
    Hotel Booking Payment Request: version: 1.1.9, author: MotoPress
    Hotel Booking PDF Invoices: version: 1.3.0, author: MotoPress
    Hotel Booking Reviews: version: 1.2.7, author: MotoPress
    Hotel Booking WooCommerce Payments: version: 1.0.10, author: MotoPress
    Hoteller Theme Elements for Elementor: version: 3.9, author: ThemGoods
    LiteSpeed Cache: version: 6.1, author: LiteSpeed Technologies
    LoftLoader: version: 2.4.0, author: Loft.Ocean
    MC4WP: Mailchimp for WordPress: version: 4.9.11, author: ibericode
    One Click Demo Import: version: 3.2.0, author: OCDI
    OptinMonster: version: 2.16.0, author: OptinMonster Popup Builder Team
    UserFeedback Lite: version: 1.0.14, author: UserFeedback Team
    WooCommerce: version: 8.6.1, author: Automattic
    WPForms Lite: version: 1.8.7.2, author: WPForms wp-media image_editor: WP_Image_Editor_Imagick
    imagick_module_version: 1809
    imagemagick_version: ImageMagick 7.1.1-19 Q16-HDRI x86_64 21601 https://imagemagick.org
    imagick_version: 3.7.0
    file_uploads: 1
    post_max_size: 2048M
    upload_max_filesize: 2048M
    max_effective_size: 2 GB
    max_file_uploads: 20
    imagick_limits:
    imagick::RESOURCETYPE_AREA: 2 TB
    imagick::RESOURCETYPE_DISK: 9.2233720368548E+18
    imagick::RESOURCETYPE_FILE: 196608
    imagick::RESOURCETYPE_MAP: 1.006 GB
    imagick::RESOURCETYPE_MEMORY: 503 GB
    imagick::RESOURCETYPE_THREAD: 1
    imagick::RESOURCETYPE_TIME: 9.2233720368548E+18
    imagemagick_file_formats: 3FR, 3G2, 3GP, A, AAI, AI, APNG, ART, ARW, ASHLAR, AVI, AVIF, AVS, B, BAYER, BAYERA, BGR, BGRA, BGRO, BIE, BMP, BMP2, BMP3, BRF, C, CAL, CALS, CANVAS, CAPTION, CIN, CIP, CLIP, CMYK, CMYKA, CR2, CR3, CRW, CUBE, CUR, CUT, DATA, DCM, DCR, DCRAW, DCX, DDS, DFONT, DNG, DOT, DPX, DXT1, DXT5, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, ERF, EXR, FARBFELD, FAX, FF, FILE, FITS, FL32, FLV, FRACTAL, FTP, FTS, FTXT, G, G3, G4, GIF, GIF87, GRADIENT, GRAY, GRAYA, GROUP4, GV, HALD, HDR, HEIC, HEIF, HISTOGRAM, HRZ, HTM, HTML, HTTP, HTTPS, ICB, ICO, ICON, IIQ, INFO, INLINE, IPL, ISOBRL, ISOBRL6, J2C, J2K, JBG, JBIG, JNG, JNX, JP2, JPC, JPE, JPEG, JPG, JPM, JPS, JPT, JSON, K, K25, KDC, LABEL, M, M2V, M4V, MAC, MAP, MASK, MAT, MATTE, MEF, MIFF, MKV, MNG, MONO, MOV, MP4, MPC, MPEG, MPG, MPO, MRW, MSL, MSVG, MTV, MVG, NEF, NRW, NULL, O, ORA, ORF, OTB, OTF, PAL, PALM, PAM, PANGO, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PDFA, PEF, PES, PFA, PFB, PFM, PGM, PGX, PHM, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG00, PNG24, PNG32, PNG48, PNG64, PNG8, PNM, POCKETMOD, PPM, PS, PS2, PS3, PSB, PSD, PTIF, PWP, QOI, R, RADIAL-GRADIENT, RAF, RAS, RAW, RGB, RGB565, RGBA, RGBO, RGF, RLA, RLE, RMF, RSVG, RW2, SCR, SCREENSHOT, SCT, SFW, SGI, SHTML, SIX, SIXEL, SPARSE-COLOR, SR2, SRF, STEGANO, STRIMG, SUN, SVG, SVGZ, TEXT, TGA, THUMBNAIL, TIFF, TIFF64, TILE, TIM, TM2, TTC, TTF, TXT, UBRL, UBRL6, UIL, UYVY, VDA, VICAR, VID, VIFF, VIPS, VST, WBMP, WEBM, WEBP, WMF, WMV, WMZ, WPG, X, X3F, XBM, XC, XCF, XPM, XPS, XV, XWD, Y, YAML, YCbCr, YCbCrA, YUV
    gd_version: 2.3.3
    gd_formats: GIF, JPEG, PNG, WebP, BMP, AVIF, XPM
    ghostscript_version: 9.27 wp-server server_architecture: Linux 4.18.0-513.11.1.lve.el8.x86_64 x86_64
    httpd_software: LiteSpeed
    php_version: 8.1.27 64bit
    php_sapi: litespeed
    max_input_variables: 5000
    time_limit: 360
    memory_limit: 2048M
    max_input_time: 360
    upload_max_filesize: 2048M
    php_post_max_size: 2048M
    curl_version: 7.87.0 OpenSSL/1.1.1w
    suhosin: false
    imagick_availability: true
    pretty_permalinks: true
    htaccess_extra_rules: true
    current: 2024-03-04T14:13:09+00:00
    utc-time: Monday, 04-Mar-24 14:13:09 UTC
    server-time: 2024-03-04T15:13:07+01:00 wp-database extension: mysqli
    server_version: 10.11.7-MariaDB-cll-lve
    client_version: mysqlnd 8.1.27
    max_allowed_packet: 1073741824
    max_connections: 2000 wp-constants WP_HOME: undefined
    WP_SITEURL: undefined
    WP_CONTENT_DIR: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content
    WP_PLUGIN_DIR: /home/u392871807/domains/hotelgruenberger.de/public_html/wp-content/plugins
    WP_MEMORY_LIMIT: 40M
    WP_MAX_MEMORY_LIMIT: 2048M
    WP_DEBUG: false
    WP_DEBUG_DISPLAY: true
    WP_DEBUG_LOG: false
    SCRIPT_DEBUG: false
    WP_CACHE: true
    CONCATENATE_SCRIPTS: undefined
    COMPRESS_SCRIPTS: undefined
    COMPRESS_CSS: undefined
    WP_ENVIRONMENT_TYPE: Nicht definiert
    WP_DEVELOPMENT_MODE: undefined
    DB_CHARSET: utf8
    DB_COLLATE: undefined wp-filesystem wordpress: writable
    wp-content: writable
    uploads: writable
    plugins: writable
    themes: writable
    mu-plugins: writable aioseo (1) noindexed: Suchseite wpforms version: 1.8.7.2
    lite: 17. Januar 2024 um 12:42 Uhr
    upload_dir: Beschreibbar
    total_forms: undefined
    total_submissions: undefined

    Hallo,

    Bitte bei dem Bericht nicht „schimpfen“

    Warum sollten wir schimpfen? 😉

    Leider ist aber unklar, welche Zeile „gefxed“ werden soll. Wenn es z. B. um die untere Zeile geht, müsste die CSS-Regel wie folgt lauten (kann allerdings sicher noch optimiert werden):

    section.elementor-section.elementor-top-section.elementor-element.elementor-element-4291a076.elementor-section-content-middle.elementor-section-boxed.elementor-section-height-default.elementor-section-height-default {
        position: fixed;
        bottom: 0;
        right: 0;
        width: 100%;
        justify-content: center;
        background-color: antiquewhite;
    }

    Du verwendest allerdings Elementor Pro. Ich kann mir vorstellen, dass du da durch irgendwelche Einstellungen ein ähnliches Ergebnis erreichen kannst. Ich verwende Elementor nicht.

    Wie gesagt: Wir können dir bei gekauften Themes (Hoteller) oder Plugins (Elementor Pro) so gut wie gar nicht helfen, weil sie uns nicht zur Verfügung stehen. Wir müssten sonst bei jeder Frage erst einmal das entsprechende Theme oder Plugin kaufen, uns dort einarbeiten und dann kostenlos den Support anbieten, für den du beim Kauf eigentlich bezahlt hast. Du solltest dich in dem Fall an die Entwickler wenden. Lies bitte auch mal in der FAQ II, 1b zu diesem Thema.

    Viele Grüße
    Hans-Gerd

    Thread-Starter lilbigjim

    (@lilbigjim)

    Danke für die Infos. Ich habe die Entwickler mal angeschrieben. Kann mir nicht vorstellen das ich der erste bin der danach fragt. Besten Dank.

    Wir freuen uns über eine Rückmeldung.

Ansicht von 9 Antworten - 1 bis 9 (von insgesamt 9)