Support » Plugins » Header fixieren OceanWP

  • Gelöst esg52

    (@esg52)


    Guten Abend,
    ich nutze das Forum erstmalig und hoffe, alles richtig zu machen.
    Meine Frage:
    Ich möchte den Header meiner Seite fixieren, damit er beim Runterscrollen oben nicht verschwindet.
    Mein verwendetes Theme ist OceanWP, Plugins: Ocean Extra und Elementor.
    Gibt es ein kostenloses und anwenderfreundliches Plugin dafür?
    Danke für eine Antwort.
    Eva

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

Ansicht von 15 Antworten - 1 bis 15 (von insgesamt 19)
  • Hallo @esg52

    trag das Folgende im Backend unter Design -> Customizer -> Zusätliches CSS ganz ans Ende ein:

    @media screen and (min-width: 600px) {
        nav#site-navigation {
           float: right;
        }
        #site-navigation-wrap {
            width: -webkit-calc(100% - 70px);
    	width: -moz-calc(100% - 70px);
            width: calc(100% - 70px);
        }
        #site-logo {
            width: 70px;
        }
        #site-header {
            position: fixed;
        }
    }
    Thread-Starter esg52

    (@esg52)

    Liebe Angelika,
    herzlichen Dank, es hat auf Anhieb so funktioniert!!

    Hallo Angelika,
    kannst Du das für einen kompletten WordPress-Neuling ein klein bißchen klären:
    Hab die gleiche Konstellation wie Eva (OceanWP + Ocean Extra + Elementor).
    Finde aber unter dem Customizer nur die Auswahl „Custom CSS/JS“ und dort ist bisher alles leer, so daß ich kein „Ende“ habe, an das ich anfügen könnte…
    Was versteh ich da nicht? (ist „Backend“ irgendwo anders?)
    Wär schön, wenn Du mir auf die Sprünge helfen könntest.
    Danke schon mal!
    Helmut

    Hallo,
    nach Anmeldung im Dashboard unter Design > Customizer > Zusätzliches CSS: wenn da noch nichts eingetragen ist, dann einfach die o. g. Regeln von Angelika da rein kopieren, siehe hier mit den Regeln:
    Customizer
    Viele Grüße
    Hans-Gerd

    Hallo Hans-Gerd,
    was mich irritiert ist:
    Unter Design> Customizer> … da gibt es bei mir keinen Punkt „zusätzliches“ CSS, sondern nur „Custom CSS/JS“ (leider kann ich hier in die Antwort keinen screenshot/ Bild einfügen).
    Wenn ich nun dort im leeren Custom CSS/JS die obigen Regeln reinkopiere, dann ändert sich zwar die Größe des Headers, er wird aber nicht fixiert.
    Und wenn ich nur die wohl entscheidende Passage
    „#site-header {position: fixed;}“
    reinkopiere, ändert sich gar nichts.

    Wo ist da der Haken?
    Grüße
    Helmut

    Hallo,
    wenn du Ocean Extra installiert hast, dann heißt der Punkt tatsächlich „Custom CSS/JS“.
    Aber: wenn du den Code von Angelika so wie ich das im Screenshot gezeigt habe, in das Fenster „Custom CSS/JS“ kopierst, dann wird der Header bei mir in einer Testinstanz wie gewünscht fixiert.
    Steht da denn schon was anderes drin?
    Viele Grüße
    Hans-Gerd

    Hmmm – gibts nicht:
    Jetzt hab ich vor ein paar Minuten auf eine Meldung hin bei den Themes „Ocean WP“ aktualisiert und tatsächlich steht jetzt in dem Custom CSS/JS ein Text drin, der zuvor aber nicht da war, da herrschte vollkommene Leere (?).
    Der Text da drin lautet:

      .envato-block__preview{
      	overflow: visible;
      }
      /* Border Radius */
      .envato-kit-139-accordion .elementor-widget-container{
      	border-radius: 10px !important;
      }
      .envato-kit-139-map iframe,
      .envato-kit-139-slider .slick-slide,
      .envato-kit-139-flipbox .elementor-flip-box div{
      		border-radius: 10px !important;
      }
      /** End Block Kit CSS: 142-3-a175df65179b9ef6a5ca9f1b2c0202b9 **/

    Bin zugegebenermaße noch mehr verwirrt 🙁 – (außer dass diese Eintragungen eher nicht direkt mit dem Header zusammenhängen).

    Allerdings: auch wenn ich jetzt hier die Einfügung wie von Angelika beschrieben vornehme, ändert sich nichts (außer dass der Header seine Größe etwas verändert).
    Grüße
    Helmut

    Hallo,
    hast du denn irgendein Cache-Plugin aktiviert? – Das Plugin sollte auf jeden Fall bei solchen Entwicklungen erst mal deaktiviert werden.

    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.

    Und den Code von Angelika hast du hinter dem vorhandenen Code eingefügt?
    Viele Grüße
    Hans-Gerd

    Ja, den Code hab ich am Ende, hinter allem andern eingefügt.

    Hier folgt nun der Bericht aus der Zwischenablage (ich versteh ganz überwiegend „Bahnhof“)

    
    ### wp-core ###
    
    version: 5.8.2
    site_language: de_DE
    user_language: de_DE
    timezone: Europe/Berlin
    permalink: /%postname%/
    https_status: true
    multisite: false
    user_registration: 0
    blog_public: 0
    default_comment_status: open
    environment_type: production
    user_count: 1
    dotorg_communication: true
    
    ### wp-paths-sizes ###
    
    wordpress_path: /home/www/doc/34485/feuerundwind.de/www/wordpress
    wordpress_size: 47,45 MB (49755724 bytes)
    uploads_path: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content/uploads
    uploads_size: 8,93 MB (9366676 bytes)
    themes_path: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content/themes
    themes_size: 26,85 MB (28149149 bytes)
    plugins_path: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content/plugins
    plugins_size: 47,88 MB (50204894 bytes)
    database_size: 13,05 MB (13680640 bytes)
    total_size: 144,15 MB (151157083 bytes)
    
    ### wp-active-theme ###
    
    name: OceanWP (oceanwp)
    version: 3.1.1
    author: Nick
    author_website: https://oceanwp.org/about-me/
    parent_theme: none
    theme_features: core-block-patterns, widgets-block-editor, align-wide, wp-block-styles, responsive-embeds, editor-styles, editor-style, menus, post-formats, title-tag, automatic-feed-links, post-thumbnails, custom-header, custom-logo, html5, woocommerce, wc-product-gallery-zoom, wc-product-gallery-lightbox, wc-product-gallery-slider, customize-selective-refresh-widgets, widgets
    theme_path: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content/themes/oceanwp
    auto_update: Deaktiviert
    
    ### wp-themes-inactive (3) ###
    
    Twenty Nineteen: version: 2.1, author: WordPress-Team, Automatische Aktualisierungen deaktiviert
    Twenty Twenty: version: 1.8, author: WordPress-Team, Automatische Aktualisierungen deaktiviert
    Twenty Twenty-One: version: 1.4, author: WordPress-Team, Automatische Aktualisierungen deaktiviert
    
    ### wp-plugins-active (4) ###
    
    Elementor: version: 3.4.8, author: Elementor.com, Automatische Aktualisierungen aktiviert
    Envato Elements: version: 2.0.11, author: Envato, Automatische Aktualisierungen aktiviert
    Ocean Extra: version: 1.9.0, author: OceanWP, Automatische Aktualisierungen aktiviert
    Yoast SEO: version: 17.6, author: Team Yoast, Automatische Aktualisierungen aktiviert
    
    ### wp-media ###
    
    image_editor: WP_Image_Editor_Imagick
    imagick_module_version: 1687
    imagemagick_version: ImageMagick 6.9.7-4 Q16 x86_64 20170114 http://www.imagemagick.org
    imagick_version: 3.4.4
    file_uploads: File uploads is turned off
    post_max_size: 32M
    upload_max_filesize: 32M
    max_effective_size: 32 MB
    max_file_uploads: 20
    imagick_limits: 
    	imagick::RESOURCETYPE_AREA: 122 MB
    	imagick::RESOURCETYPE_DISK: 1073741824
    	imagick::RESOURCETYPE_FILE: 49152
    	imagick::RESOURCETYPE_MAP: 512 MB
    	imagick::RESOURCETYPE_MEMORY: 256 MB
    	imagick::RESOURCETYPE_THREAD: 4
    imagemagick_file_formats: 3FR, AAI, AI, ART, ARW, AVI, AVS, BGR, BGRA, BGRO, BIE, BMP, BMP2, BMP3, BRF, CAL, CALS, CANVAS, CAPTION, CIN, CIP, CLIP, CMYK, CMYKA, CR2, CRW, CUR, CUT, DATA, DCM, DCR, DCX, DDS, DFONT, DNG, DPX, DXT1, DXT5, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, ERF, FAX, FILE, FITS, FRACTAL, FTP, FTS, G3, G4, GIF, GIF87, GRADIENT, GRAY, GROUP4, H, HALD, HDR, 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, K25, KDC, LABEL, M2V, M4V, MAC, MAGICK, MAP, MASK, MAT, MATTE, MEF, MIFF, MKV, MNG, MONO, MOV, MP4, MPC, MPEG, MPG, MRW, MSL, MTV, MVG, NEF, NRW, NULL, ORF, OTB, OTF, PAL, PALM, PAM, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PDFA, PEF, PES, PFA, PFB, PFM, PGM, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG00, PNG24, PNG32, PNG48, PNG64, PNG8, PNM, PPM, PREVIEW, PS, PS2, PS3, PSB, PSD, PTIF, PWP, RADIAL-GRADIENT, RAF, RAS, RAW, RGB, RGBA, RGBO, RGF, RLA, RLE, RMF, RW2, SCR, SCT, SFW, SGI, SHTML, SIX, SIXEL, SPARSE-COLOR, SR2, SRF, STEGANO, SUN, TEXT, TGA, THUMBNAIL, TIFF, TIFF64, TILE, TIM, TTC, TTF, TXT, UBRL, UBRL6, UIL, UYVY, VDA, VICAR, VID, VIFF, VIPS, VST, WBMP, WMV, WPG, X, X3F, XBM, XC, XCF, XPM, XPS, XV, XWD, YCbCr, YCbCrA, YUV
    gd_version: bundled (2.1.0 compatible)
    gd_formats: GIF, JPEG, PNG, WebP, BMP
    ghostscript_version: 9.26
    
    ### wp-server ###
    
    server_architecture: Linux 4.19.67-xen-64bit x86_64
    httpd_software: Apache
    php_version: 7.4.25 64bit
    php_sapi: cgi-fcgi
    max_input_variables: 1000
    time_limit: 30
    memory_limit: 256M
    max_input_time: 60
    upload_max_filesize: 32M
    php_post_max_size: 32M
    curl_version: 7.52.1 OpenSSL/1.0.2u
    suhosin: false
    imagick_availability: true
    pretty_permalinks: true
    htaccess_extra_rules: false
    
    ### wp-database ###
    
    extension: mysqli
    server_version: 10.3.32-MariaDB-1:10.3.32+maria~stretch
    client_version: mysqlnd 7.4.25
    
    ### wp-constants ###
    
    WP_HOME: undefined
    WP_SITEURL: undefined
    WP_CONTENT_DIR: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content
    WP_PLUGIN_DIR: /home/www/doc/34485/feuerundwind.de/www/wordpress/wp-content/plugins
    WP_MEMORY_LIMIT: 40M
    WP_MAX_MEMORY_LIMIT: 256M
    WP_DEBUG: false
    WP_DEBUG_DISPLAY: true
    WP_DEBUG_LOG: false
    SCRIPT_DEBUG: false
    WP_CACHE: false
    CONCATENATE_SCRIPTS: undefined
    COMPRESS_SCRIPTS: undefined
    COMPRESS_CSS: undefined
    WP_LOCAL_DEV: undefined
    DB_CHARSET: utf8mb4
    DB_COLLATE: undefined
    
    ### wp-filesystem ###
    
    wordpress: writable
    wp-content: writable
    uploads: writable
    plugins: writable
    themes: writable
    
    

    Ehrlich gesagt fällt mir dazu nicht mehr viel ein.
    Entweder machst du beim Einfügen etwas falsch (bei mir klappt es damit ohne Probleme) oder es liegt an dem Plugin „Envato Elements“. Du könntest das Plugin nach einer Sicherung ggfs. mal deaktivieren.

    OK – vielen Dank für die Mühe und für das das mit-Überlegen 🙂
    Viele Grüße
    Helmut

    Hallo,

    ich habe das oben genannte eingefügt und leider wird bei mir nur das Logo und das transparente Menü bewegt.. ohne den Hintergrund. Was mache ich falsch?

    Vielen Dank

    @ina199429
    Moderatorenhinweis: Bitte immer ein neues Thema beginnen und nicht an ein sogar gelöstes Thema anhängen, siehe FAQ und bitte dann auch den Link zur Seite eintragen.

    zum Moderatorenhinweis:

    Das Thema ist keineswegs gelöst, es ruht allenfalls. Denn nach wie vor bringt die Einfügung des Codes im Backend eben nicht die erwünschte Fixierung des Headers. Da mir dies nicht so wichtig erscheint, hab ich den Versuch schlicht aufgegeben.

    Gelöst ist der Thread damit natürlich nicht und die Frage von ina199429 scheint nicht ganz falsch platziert zu sein.

    Nix für ungut
    Helmut

    @feuerundwind
    schau doch mal bitte in die FAQ:
    „Vor dem Stellen der Frage: Suchen
    https://de.wordpress.org/support/search/
    Aber Achtung: für neue Fragen immer einen neuen Thread eröffnen und nicht irgendwo ranhängen!“

    Die Bitte war übrigens an @ina199429 gerichtet und nicht an dich.
    Warum der thread als gelöst markiert ist, kann ich dir nicht sagen.
    Nix für ungut
    Hans-Gerd

Ansicht von 15 Antworten - 1 bis 15 (von insgesamt 19)
  • Das Thema „Header fixieren OceanWP“ ist für neue Antworten geschlossen.