InspireNetHost Posted January 21, 2021 Share Posted January 21, 2021 On 1/20/2021 at 4:08 PM, brian! said: it still works in v8.1... 🙂 Hi Brian, Could you advise what should I add to the header so that I can work from that please? 0 Quote Link to comment Share on other sites More sharing options...
Stuart Newton Posted January 25, 2021 Share Posted January 25, 2021 the footer of WHMCS theme "Twenty-one" has the language and currency tied together, how would you place this into the header.tpl file of theme six 0 Quote Link to comment Share on other sites More sharing options...
InspireNetHost Posted January 25, 2021 Share Posted January 25, 2021 (edited) 23 hours ago, Stuart Newton said: the footer of WHMCS theme "Twenty-one" has the language and currency tied together, how would you place this into the header.tpl file of theme six Hi Stuart, So I tried pasting:    <div class="modal system-modal fade" id="modalAjax" tabindex="-1" role="dialog" aria-hidden="true">     <div class="modal-dialog">       <div class="modal-content">         <div class="modal-header">           <h5 class="modal-title"></h5>           <button type="button" class="close" data-dismiss="modal">             <span aria-hidden="true">×</span>             <span class="sr-only">{lang key='close'}</span>           </button>         </div>         <div class="modal-body">           {lang key='loading'}         </div>         <div class="modal-footer">           <div class="float-left loader">             <i class="fas fa-circle-notch fa-spin"></i>             {lang key='loading'}           </div>           <button type="button" class="btn btn-default" data-dismiss="modal">             {lang key='close'}           </button>           <button type="button" class="btn btn-primary modal-submit">             {lang key='submit'}           </button>         </div>       </div>     </div>   </div>   <form method="get" action="{$currentpagelinkback}">     <div class="modal modal-localisation" id="modalChooseLanguage" tabindex="-1" role="dialog">       <div class="modal-dialog modal-lg" role="document">         <div class="modal-content">           <div class="modal-body">             <button type="button" class="close text-light" data-dismiss="modal" aria-label="Close">               <span aria-hidden="true">×</span>             </button>             {if $languagechangeenabled && count($locales) > 1}               <h5 class="h5 pt-5 pb-3">{lang key='chooselanguage'}</h5>               <div class="row item-selector">               <input type="hidden" name="language" value="">                 {foreach $locales as $locale}                   <div class="col-4">                     <a href="#" class="item{if $language == $locale.language} active{/if}" data-value="{$locale.language}">                       {$locale.localisedName}                     </a>                   </div>                 {/foreach}               </div>             {/if}             {if !$loggedin && $currencies}               <p class="h5 pt-5 pb-3">{lang key='choosecurrency'}</p>               <div class="row item-selector">                 <input type="hidden" name="currency" value="">                 {foreach $currencies as $selectCurrency}                   <div class="col-4">                     <a href="#" class="item{if $activeCurrency.id == $selectCurrency.id} active{/if}" data-value="{$selectCurrency.id}">                       {$selectCurrency.prefix} {$selectCurrency.code}                     </a>                   </div>                 {/foreach}               </div>             {/if}           </div>           <div class="modal-footer">             <button type="submit" class="btn btn-default">{lang key='apply'}</button>           </div>         </div>       </div>     </div>   </form> In the header with no joy. Maybe @brian! could help with this one. Edited January 25, 2021 by srwilliams86 0 Quote Link to comment Share on other sites More sharing options...
Stuart Newton Posted January 25, 2021 Share Posted January 25, 2021 Yeah I tried that also. I also copied over the css. And it didn't work. The problem i am having is the js. I tried to copy the function over but it either doesn't work or causes other functions to fail. But in truth, I know zero about js. Just tried using Firefox debugger to identify the element, then cut and paste. Not as easy as I thought. It would be good to have the ability to have the joint currency/ language selector in one button in the header of my install. Hopefully someone here can assist 0 Quote Link to comment Share on other sites More sharing options...
brian! Posted January 26, 2021 Share Posted January 26, 2021 On 21/01/2021 at 20:54, srwilliams86 said: Hi Brian, Could you advise what should I add to the header so that I can work from that please? literally, it's just copy & paste into the header.tpl wherever you want to show the currency dropdown... {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"> {$activeLocale.localisedName} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}">{$locale.localisedName}</a> </li> {/foreach} </ul> </div> </li> {/if} {if !$loggedin && count($currencies) > 1} <li> <a href="#" class="choose-currency" data-toggle="popover" id="currencyChooser" data-container="body" data-placement="bottom" data-content='{foreach from=$currencies item=currchoice}<div class="col-md-4"><img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> <a href="{$currentpagelinkback}currency={$currchoice.id}">{if $currency.id eq $currchoice.id}<u>{/if}{$currchoice.code}</u></a></div>{/foreach}<br><br>'><i class="fal fa-sack-dollar"></i> <b class="caret"></b></a> </li> {/if} I suspect the biggest issue you might run into is the icons - because I have HRK & RON as currencies in my dev, using the default icons wouldn't really work and I don't like mix & matching icon sets - so it was easier to obtain a free icon flag pack online (plenty available) and use them in a custom directory so that the flags look consistent (and WHMCS wouldn't overwrite them)... then it's a case of renaming the image filenames to suit the currency to 3 letters, e.g GBP is gbp.png, USD is usd.png and so on. however, if you only use currencies for which WHMCS already has flag icons, then these can be used if you wish... <img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> becomes... <img src="{$BASE_PATH_IMG}/flags/{$currchoice.code|substr:0:2|strtolower}.png"> On 25/01/2021 at 00:11, Stuart Newton said: the footer of WHMCS theme "Twenty-one" has the language and currency tied together, how would you place this into the header.tpl file of theme six by making the following change to header.tpl... {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"> {$activeLocale.localisedName} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}">{$locale.localisedName}</a> </li> {/foreach} </ul> {if !$loggedin && count($currencies) > 1} <ul> {foreach from=$currencies item=currchoice} <li><a href="{$currentpagelinkback}currency={$currchoice.id}"><img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> {$currchoice.code}</a></li> {/foreach} </ul> {/if} </div> </li> {/if} you could, if you wanted to, link the languages to currencies so that a link changed both, but often there isn't a simple relationship between the two, e.g do you link English to GBP, USD, AUD, NZD etc? do you link French to EUR or CAD (for Canadian French users) ?? and then you have the issue of logged in users not being able to change currencies (which you could get around with an IF statement to check their not logged in before changing currencies - though WHMCS would not allow you to change currencies when logged in anyway). 13 hours ago, srwilliams86 said: So I tried pasting in the header with no joy I suspect you could make it work if you had to, but just pasting a BS4 template code into BS3 isn't going to work - additionally, there may be CSS classes that need defining in Six... the above solution would be simpler. 🙂 1 Quote Link to comment Share on other sites More sharing options...
Stuart Newton Posted January 27, 2021 Share Posted January 27, 2021 How can we change the above code to show flags next to the language? 0 Quote Link to comment Share on other sites More sharing options...
InspireNetHost Posted January 28, 2021 Share Posted January 28, 2021 I went with this. However the pages I have added to WHMCS are not updating the prices shown. 0 Quote Link to comment Share on other sites More sharing options...
brian! Posted January 28, 2021 Share Posted January 28, 2021 13 hours ago, Stuart Newton said: How can we change the above code to show flags next to the language? do you mean.... ? it's just the same principle as with the currencies.... {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"> {$activeLocale.localisedName} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li><a href="{$currentpagelinkback}language={$locale.language}"><img src="{$BASE_PATH_IMG}/newflags/{$locale.language|strtolower}.png"> {$locale.localisedName}</a> </li> {/foreach} </ul> {if !$loggedin && count($currencies) > 1} <ul> {foreach from=$currencies item=currchoice} <li><a href="{$currentpagelinkback}currency={$currchoice.id}"><img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> {$currchoice.code}</a></li> {/foreach} </ul> {/if} </div> </li> {/if} ... except this time you'll need to create image files with the name of the language in lowercase, e.g french.png, english.png etc choosing an "appropriate" icon for each - in the above screenshot, they're 16px images. annoyingly, the icons can throw off the alignment for those languages with long names, e.g Nederlands and Macedonian (Nederlands is out by 1px!)... ... the solution to that would be a tweak of the CSS padding of that element in a custom.css or hook... .language-popover .popover-content li { padding: 0 20px 0 36px !important; } ... and if you were logged in, the currencies wouldn't be shown. 5 minutes ago, srwilliams86 said: I went with this. However the pages I have added to WHMCS are not updating the prices shown. they wouldn't, $currency only exists on cart pages - on these custom pages, how are you displaying the prices ? 0 Quote Link to comment Share on other sites More sharing options...
InspireNetHost Posted January 28, 2021 Share Posted January 28, 2021 52 minutes ago, brian! said: They wouldn't, $currency only exists on cart pages - on these custom pages, how are you displaying the prices ? <div class="col-xl-3 col-lg-6 col-md-6 col-sm-6 col-12"> <div class="box wow zoomInDown" data-wow-delay="0.2s"> <div class="icon"> <div class="info"> <h2 class="title">COD: MW3</h2> <img alt="" src="{$WEB_ROOT}/templates/{$child_template}/assets/images/hosting/game-servers/icons/icon_2.png" srcset="{$WEB_ROOT}/templates/{$child_template}/assets/responsive/hosting/game-servers/icons/icon_2@2x.png 2x" /> <h3 class="price"><small>Slots From</small><br /> <br /> $1.99 p/m</h3> <div class="more"><a href="{$WEB_ROOT}/cart.php?a=add&pid=2" class="btn btn-md btn-green"><i class="fas fa-cart-plus"></i> Order Today</a></div> </div> </div> <div class="space"></div> </div> </div> As shown above 0 Quote Link to comment Share on other sites More sharing options...
Stuart Newton Posted January 28, 2021 Share Posted January 28, 2021 Brian the language flags solution is simpler than I thought. I was trying to find the smarty tag for 2 digit language code. Lol simpliar to rename the images. As for css will have a look and use your code posted. Whats the difference between $locale.language and $locale.localisedName 0 Quote Link to comment Share on other sites More sharing options...
brian! Posted January 28, 2021 Share Posted January 28, 2021 3 minutes ago, Stuart Newton said: I was trying to find the smarty tag for 2 digit language code. you could use $locales.languageCode if you wanted to make the images filenames 2 characters, e.g ar.png, az.png etc. 5 minutes ago, Stuart Newton said: Whats the difference between $locale.language and $locale.localisedName language will always be in lowercase English, whereas localisedName could be using characters from that language - which might prove difficult for some filenames... so for simplicity, I thought it easier, and more consistent to just use the language name. 0 Quote Link to comment Share on other sites More sharing options...
brian! Posted January 28, 2021 Share Posted January 28, 2021 36 minutes ago, srwilliams86 said: As shown above if you're hardcoding a price in the template, that that explains it. 🙂 can you use a Data Feed to get the price ? if so, then you can get it to use the currency selected in the header... if this is a WHMCS page, then you could also use a hook to return the value from the database based on the chosen currency, but data feeding might be simpler for you in your situation. 0 Quote Link to comment Share on other sites More sharing options...
InspireNetHost Posted January 28, 2021 Share Posted January 28, 2021 4 hours ago, brian! said: if you're hardcoding a price in the template, that that explains it. 🙂 can you use a Data Feed to get the price ? if so, then you can get it to use the currency selected in the header... if this is a WHMCS page, then you could also use a hook to return the value from the database based on the chosen currency, but data feeding might be simpler for you in your situation. Hi @brian! I can see: <script language="javascript" src="feeds/productsinfo.php?pid=1&get=price&billingcycle=monthly¤cy=2"></script> Of course how would I get that price to update when the currency is selected? 0 Quote Link to comment Share on other sites More sharing options...
brian! Posted January 29, 2021 Share Posted January 29, 2021 17 hours ago, srwilliams86 said: Of course how would I get that price to update when the currency is selected? well the above page shows how to do it if you're in a php page outside of WHMCS... if you're trying to do this on a WHMCS template, custom or otherwise, then you could use... <script language="javascript" src="feeds/productsinfo.php?pid=1&get=price&billingcycle=monthly¤cy={$smarty.get.currency}"></script> that should work on virtually any version of WHMCS - however, if you're using v8+, then it would now stupidly break the Smarty Security Policy, so you would need to enable 'get' in your configuration.php file... 🙄 $smarty_security_policy = array( 'system' => array( 'enabled_special_smarty_vars' => array( 'get', ), ), ); 0 Quote Link to comment Share on other sites More sharing options...
Stuart Newton Posted January 31, 2021 Share Posted January 31, 2021 (edited) A huge help to @brain! I finally got the look I was aiming for, using the following code added the below code to /templates/mytemplate/header.tpl (replaced the original language selector on my theme) {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"><img src="{$BASE_PATH_IMG}/langflags/{$activeLocale.localisedName|strtolower}.png"> {$activeLocale.localisedName}{if !$loggedin && count($currencies) > 1} / {$activeCurrency.code} {/if} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}"><img src="{$BASE_PATH_IMG}/langflags/{$locale.language|strtolower}.png"> {$locale.localisedName}</a> </li> {/foreach} </ul> {if !$loggedin && count($currencies) > 1} <ul> {foreach from=$currencies item=currchoice} <li><a href="{$currentpagelinkback}currency={$currchoice.id}"><img src="{$BASE_PATH_IMG}/langflags/{$currchoice.code|substr:0:2|strtolower}.png"> {$currchoice.code}</a></li> {/foreach} </ul> {/if} </div> </li> {/if} and the following CSS in /templates/mytemplate/css/custom.css .language-popover .popover-content li { padding: 0 20px 0 30px !important; } And also included the language and currency flags, plus the icon set incase others want different languages / currencies etc. Simply unzip and upload "langflags" to /assets/img/ langflags.zip phoca_flag_icons_16-12.zip Edited January 31, 2021 by Stuart Newton updated text 1 Quote Link to comment Share on other sites More sharing options...
InspireNetHost Posted January 31, 2021 Share Posted January 31, 2021 55 minutes ago, Stuart Newton said: A huge help to @brain! I finally got the look I was aiming for, using the following code added the below code to /templates/mytemplate/header.tpl (replaced the original language selector on my theme) {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"><img src="{$BASE_PATH_IMG}/langflags/{$activeLocale.localisedName|strtolower}.png"> {$activeLocale.localisedName}{if !$loggedin && count($currencies) > 1} / {$activeCurrency.code} {/if} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}"><img src="{$BASE_PATH_IMG}/langflags/{$locale.language|strtolower}.png"> {$locale.localisedName}</a> </li> {/foreach} </ul> {if !$loggedin && count($currencies) > 1} <ul> {foreach from=$currencies item=currchoice} <li><a href="{$currentpagelinkback}currency={$currchoice.id}"><img src="{$BASE_PATH_IMG}/langflags/{$currchoice.code|substr:0:2|strtolower}.png"> {$currchoice.code}</a></li> {/foreach} </ul> {/if} </div> </li> {/if} and the following CSS in /templates/mytemplate/css/custom.css .language-popover .popover-content li { padding: 0 20px 0 30px !important; } And also included the language and currency flags, plus the icon set incase others want different languages / currencies etc. Simply unzip and upload "langflags" to /assets/img/ langflags.zip 21.62 kB · 1 download phoca_flag_icons_16-12.zip 616.61 kB · 0 downloads Glad you got it sorted. Ive also been able to do mine including changing the prices when shown! 0 Quote Link to comment Share on other sites More sharing options...
brutno Posted January 24, 2022 Share Posted January 24, 2022 On 1/26/2021 at 6:31 PM, brian! said: literally, it's just copy & paste into the header.tpl wherever you want to show the currency dropdown... {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"> {$activeLocale.localisedName} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}">{$locale.localisedName}</a> </li> {/foreach} </ul> </div> </li> {/if} {if !$loggedin && count($currencies) > 1} <li> <a href="#" class="choose-currency" data-toggle="popover" id="currencyChooser" data-container="body" data-placement="bottom" data-content='{foreach from=$currencies item=currchoice}<div class="col-md-4"><img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> <a href="{$currentpagelinkback}currency={$currchoice.id}">{if $currency.id eq $currchoice.id}<u>{/if}{$currchoice.code}</u></a></div>{/foreach}<br><br>'><i class="fal fa-sack-dollar"></i> <b class="caret"></b></a> </li> {/if} I suspect the biggest issue you might run into is the icons - because I have HRK & RON as currencies in my dev, using the default icons wouldn't really work and I don't like mix & matching icon sets - so it was easier to obtain a free icon flag pack online (plenty available) and use them in a custom directory so that the flags look consistent (and WHMCS wouldn't overwrite them)... then it's a case of renaming the image filenames to suit the currency to 3 letters, e.g GBP is gbp.png, USD is usd.png and so on. however, if you only use currencies for which WHMCS already has flag icons, then these can be used if you wish... <img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> becomes... <img src="{$BASE_PATH_IMG}/flags/{$currchoice.code|substr:0:2|strtolower}.png"> by making the following change to header.tpl... {if $languagechangeenabled && count($locales) > 1} <li> <a href="#" class="choose-language" data-toggle="popover" id="languageChooser"> {$activeLocale.localisedName} <b class="caret"></b> </a> <div id="languageChooserContent" class="hidden"> <ul> {foreach $locales as $locale} <li> <a href="{$currentpagelinkback}language={$locale.language}">{$locale.localisedName}</a> </li> {/foreach} </ul> {if !$loggedin && count($currencies) > 1} <ul> {foreach from=$currencies item=currchoice} <li><a href="{$currentpagelinkback}currency={$currchoice.id}"><img src="{$BASE_PATH_IMG}/newflags/{$currchoice.code|substr:0:3|strtolower}.png"> {$currchoice.code}</a></li> {/foreach} </ul> {/if} </div> </li> {/if} you could, if you wanted to, link the languages to currencies so that a link changed both, but often there isn't a simple relationship between the two, e.g do you link English to GBP, USD, AUD, NZD etc? do you link French to EUR or CAD (for Canadian French users) ?? and then you have the issue of logged in users not being able to change currencies (which you could get around with an IF statement to check their not logged in before changing currencies - though WHMCS would not allow you to change currencies when logged in anyway). I suspect you could make it work if you had to, but just pasting a BS4 template code into BS3 isn't going to work - additionally, there may be CSS classes that need defining in Six... the above solution would be simpler. 🙂 Hi @brian!, I can make instant currency update on the page, but when I browse the special pages, the foreign currency continues to show the default currency amount. How can I make the selected currency default on all pages? 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.