Reply To: language selector

#10034455
Support
Keymaster

Hello Levy,

First sorry the delay for this response, the time can increase on weekends.

Sorry but i’m little confused. You said that don’t want to make different language pages. So you want to change the language flag by without reload the page ? If it’s the case please let us know and we can send a custom JS code for you that does it.

Using only HTML files you can create separate files for each language. For example:

index.html - US
indeex-es.html - ES
index-fr.html - FR

This way you should change the first flag link with respective language. For example:

index.html - US
<li class="nav-item dropdown nav-item-left-border nav-item-left-border-remove nav-item-left-border-md-show">
	<a class="nav-link" href="#" role="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
		<img src="img/blank.gif" class="flag flag-us" alt="English" /> English
		<i class="fas fa-angle-down"></i>
	</a>
	<div class="dropdown-menu" aria-labelledby="dropdownLanguage">
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-us" alt="English" /> English</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-es" alt="English" /> Español</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-fr" alt="English" /> Française</a>
	</div>
</li>

index-es.html - ES
<li class="nav-item dropdown nav-item-left-border nav-item-left-border-remove nav-item-left-border-md-show">
	<a class="nav-link" href="#" role="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
		<img src="img/blank.gif" class="flag flag-es" alt="Español" /> Español
		<i class="fas fa-angle-down"></i>
	</a>
	<div class="dropdown-menu" aria-labelledby="dropdownLanguage">
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-us" alt="English" /> English</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-es" alt="English" /> Español</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-fr" alt="English" /> Française</a>
	</div>
</li>

index-fr.html - FR
<li class="nav-item dropdown nav-item-left-border nav-item-left-border-remove nav-item-left-border-md-show">
	<a class="nav-link" href="#" role="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
		<img src="img/blank.gif" class="flag flag-fr" alt="Française" /> Française
		<i class="fas fa-angle-down"></i>
	</a>
	<div class="dropdown-menu" aria-labelledby="dropdownLanguage">
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-us" alt="English" /> English</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-es" alt="English" /> Español</a>
		<a class="dropdown-item" href="#"><img src="img/blank.gif" class="flag flag-fr" alt="English" /> Française</a>
	</div>
</li>

You mentioned PHP. PHP is a good way to create multi language pages. The best way to change the flag according language with PHP is use a condition checking what’s the current language and display the respective language flag. For example:

<?php

// Here you need create your own way to define what's the current language. On this example we are using $_GET['language']
if( isset( $_GET['language'] ) ) {
	$current_language = $_GET['language'];
} else {
	$current_language = 'us';
}

$flags = array(
	'us' => 'English',
	'es' => 'Espanõl',
	'fr' => 'Française'
); ?>

<li class="nav-item dropdown nav-item-left-border nav-item-left-border-remove nav-item-left-border-md-show">
	<a class="nav-link" href="#" role="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
		<img src="img/blank.gif" class="flag flag-<?php echo $current_language; ?>" alt="<?php echo $flags[ $current_language ]; ?>" /> English
		<i class="fas fa-angle-down"></i>
	</a>
	<div class="dropdown-menu" aria-labelledby="dropdownLanguage">
		
		<?php foeach( $flags as $key => $value ) : ?>

			<a class="dropdown-item" href="index.php?language=<?php echo $key; ?>">
				<img src="img/blank.gif" class="flag flag-<?php echo $key; ?>" alt="<?php echo $value; ?>" /> English
			</a>

		<?php endforeach; ?>
	</div>
</li>

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.


If you are satisfied with Porto HTML and our support, please leave your comment and rating on ThemeForest downloads page. That helps us a lot: https://themeforest.net/downloads