Support » Thema en CSS/opmaak » Widgets in sidebar onderaan ipv rechts op pagina

  • Voor mijn website http://www.hordijkopreis.nl gebruik ik WordPress 4.2.2 met als thema: Sparkling. In de sidebar heb ik 4 widgets: zoeken, meest recente berichten, recente reacties en archief. Bij een volledig scherm op mijn laptop zou ik verwachten dat de de sidebar rechts verschijnt. Volgens mij was dat ik het begin ook zo, maar nu krijg ik elke keer de sidebar helemaal onderaan de pagina. Hoe kan ik dit oplossen?

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • In themes/sparkling/inc/css/bootstrap.min.css?ver=4.2.2
    staat het volgende:

    .row::after {
    clear: both;
    }

    Daardoor wordt #secondary pas op de volgende regel geplaatst.
    Je moet de clear:both ongedaan maken in je css file.

    Misschien werkt dit:
    .row{
    clear:none !important;
    }
    toevoegen in je .css file.

    Je moet in ieder geval

    .row::after {
    clear: both;
    }
    In regel 5 van de bootstrap.css aan zien te passen.

    Thread starter Erik Hordijk

    (@erik-hordijk)

    Hartelijk dank voor je snelle reactie! Sorry maar ik weet niet waar ik dat kan aanpassen. Ik heb in wordpress dashboard onder “Weergave” “Editor” gekeken bij “Template style.css” maar ik de regels hier niet staan. Waar vind ik de bootstrap css? En hoe kom ik daar? Alvast reuze bedankt voor je hulp.

    Ik heb even gekeken of je het makkelijk kunt invoeren binnen de editor.

    (Je kunt beter niets toevoegen aan e bootstrap.css)

    De opzet van de template is alsvolgt bedoeld:
    –div class row
    —- div #primary 66% width
    —- div secondary 33 % width

    Een div row met daarin 2 divs.

    Bij jou zit het alsvolgt:

    — div class row
    —- div #primary
    einde div row
    — div #secondary

    Dus de secondary div zit niet binnen de row zoals bedoeld.
    Dat is niet zo makkelijk te veranderen. Misschien kun je in de editor naar de file SIDEBAR.php gaan en daar de ‘</div>’ voor <div id=”secondary” class=”widget-area….etc.

    weghalen en die onderaan erbij plakken.

    Andere manier:
    Je kunt het ook via de css proberen op te lossen.

    Voeg dit onderaan de .css file toe:

    .row{
    width:66% !important;
    float:left;
    }
    
    .col-md-8 {
        width: 100% !important;
    }

    Misschien werkt het. Misschien ook niet. Het is niet zo’n makkelijk probleem omdat de divs niet goed nesten. 😉

    Thread starter Erik Hordijk

    (@erik-hordijk)

    Ik heb in de editor in de file SIDEBAR.php de ‘</div>’ voor <div id=”secondary” class=”widget-area….etc. verplaatst naar onderaan, zoals door jou is voorgesteld. En nu komt de sidebar kolom bij desktop en tablet in breedte weer rechts! Super dat het is opgelost. Heel hartelijk dank. De hartelijke groeten vanuit Nieuw Zeeland.

    Thread starter Erik Hordijk

    (@erik-hordijk)

    Het hier boven beschreven probleem is weer terug. Misschien doordat er een update 4.2.3. gedaan is. Ik heb beide fixes geprobeerd maar deze keer lijkt het niet te werken.

    Dit is de door mij aangepaste code van sidebar.php

    <?php
    /**
    * The Sidebar containing the main widget areas.
    *
    * @package sparkling
    */
    ?>

    <div id=”secondary” class=”widget-area col-sm-12 col-md-4″ role=”complementary”>
    <div class=”well”>
    <?php do_action( ‘before_sidebar’ ); ?>
    <?php if ( ! dynamic_sidebar( ‘sidebar-1’ ) ) : ?>

    <aside id=”search” class=”widget widget_search”>
    <?php get_search_form(); ?>
    </aside>

    <aside id=”archives” class=”widget”>
    <h3 class=”widget-title”><?php _e( ‘Archives’, ‘sparkling’ ); ?></h3>

      <?php wp_get_archives( array( ‘type’ => ‘monthly’ ) ); ?>

    </aside>

    <aside id=”meta” class=”widget”>
    <h3 class=”widget-title”><?php _e( ‘Meta’, ‘sparkling’ ); ?></h3>

      <?php wp_register(); ?>

    • <?php wp_loginout(); ?>
    • <?php wp_meta(); ?>

    </aside>

    <?php endif; // end sidebar widget area ?>

    <!– #secondary –>
    </div>
    </div>

    Maak eerst een child theme voordat je dingen gaat wijzigen. Kans dat je wijzigingen verliest bij een update is namelijk erg groot (zoals je zelf gemerkt hebt).

    Ik raad je tevens aan om niks aan bootstrap elementen aan te passen, maar dan ook helemaal niks. Het is een responsive framework wat een vaste structuur aan houdt om goed te kunnen functioneren. Ga je de bootstrap.CSS aanpassen of elementen zoals col-md-8, dan is de kans groot dat er elders op je website ongewenste aanpassingen verschijnen. Zie het als een perfecte toren die je hebt gebouwd met blokjes en je trekt van onderen een blokje eruit. Gevolg: onstabiliteit.

    Om je probleem op te lossen moet je een aanpassing maken aan de functions.php en de template pagina waar de widgets in moeten komen of de footer.php. Je wilt namelijk een widget gebied maken waarin je widgets kunt plaatsen. Op google staat veel hierover. Ook kun je het widget gebied van je sidebar verplaatsen. Je hebt dan alleen niet meer de mogelijkheid om widgets in je sidebar te plaatsen. Als je weinig kennis hebt van php, html, css raad ik je aan dit door iemand te laten doen. Dit kan iemand hier op het forum zijn of een bedrijf die dit kan doen. Hou er wel rekening mee dat dit kosten met zich mee brengt. Het zal niet heel veel zijn maar toch goed om te vermelden.

    Ikzelf doe dit soort werkzaamheden met regelmaat. Als ik je hiermee moet helpen laat je me het maar weten.

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Het onderwerp ‘Widgets in sidebar onderaan ipv rechts op pagina’ is gesloten voor nieuwe reacties.