wordpresspolylangwp-nav-walkerlanguage-switching

Polylang custom language switcher


How to create a custom polylang language switcher like this https://prnt.sc/vnj7b3 ? Html markup to be used : Parent :

<a href="#" class="menu__link language">EN
                                <span><svg width="8px" viewBox="0 0 451.847 451.847">
                                        <g>
                                            <path d="M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751
          c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0
          c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z" />
                                        </g>
                                    </svg></span>
                            </a>

Child elements that are shown in a dropdown on hover:

<div class="drop-block lang">
                    <a href="https://google.com" class="drop-block__link">RU</a>
                    <a href="https://google.com" class="drop-block__link">EN</a>
                    <a href="https://google.com" class="drop-block__link">UA</a>
                </div>

Tried this function but i have no control over the markup :

<?php pll_the_languages( array( 'dropdown' => 1, 'hide_current=> 1 ) ); ?>

Solution

  • you can get the raw data like so:

    <?php 
    // add "raw" key and save data to variable
    
    $langs_array = pll_the_languages( array( 'dropdown' => 1, 'hide_current' => 1, 'raw' => 1 ) );
    
    ?>
    
    
    <?php if ($langs_array) : ?>
      <div class="drop-block lang">
        <?php foreach ($langs_array as $lang) : ?>
          <a href="<?php echo $lang['url']; ?>" class="drop-block__link">
            <?php echo $lang['slug']; ?>
            </a>
        <?php endforeach; ?>
      </div>
    <?php endif; ?>
    
    

    more info here: https://polylang.wordpress.com/documentation/documentation-for-developers/functions-reference/