Template : Manufacturer Offcanvas Menu Icon Change From Left To Right? - Question | JoomShaper

Template : Manufacturer Offcanvas Menu Icon Change From Left To Right?

F

Fion

Template 11 months ago

Dear Sirs,

  1. https://www.joomshaper.com/joomla-templates/manufacturer can we move the offcanvas vertical menu icon from current left of the login to right of the top bar?

  2. social icons is round in shape (at offcanvas menu ) can we chang it into round corner square and in red color , by editing the css ? because we prefer the styling matching with the client logo design.

  3. now at mobile view, the manufactuer template at mobile view, the logo is below the offcavas menu icon, can we move it upward to topbar and placed at left hand side, and Right hand side is the offcanva , as what we see in mobile view of https://www.joomshaper.com/joomla-templates/nestfund ?

  4. Is there any method to have two rows of menu item text? plese refer to my hidden content and teach us.

Thanks indeed.

-1
16 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #175167

Hi there!

Thanks for reaching out.

  1. Did you try this? https://share.cleanshot.com/K1S3Y9p9
  2. Please use the following code in your custom CSS:
 .offcanvas-menu .sppb-icons-group-list li a {
        border-radius: 10px !important;
        background-color: red!important;
    }
  1. I couldn't find this issue on the demo or in my local. Can you share your site url and screenshot with indication of the issue?
  2. Do you want to break two wards menu items to separate lines? Can I have any example?

Best Regards

0
F
Fion
Accepted Answer
11 months ago #175251

Dear Rashida,

Thanks for your prompt reply and helping me again.

at Hidden content you can see my website (in Joomla 3.10.19) from which you can see there are only 4 menu item which text is located at right hand side on the logo. This is my point 4. question to see if the text can be wrapped into two rows, as the image shown in Hidden Content.

Thank indeed

Fion

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #175342

Hi,

In this link the template is not manufacturer, it's a third party template.

However, you can try the following custom code snippet in your custom CSS:

#t3-header {
    height: 100px;
}
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > li > span{
    word-break: break-word !important;
    width: 120px;
    line-height: unset;
    padding: 0px 5px;
    text-align: center;   
}
.nav > li:not(:last-child) {
    border-right: black 2px solid;
    height: 70px;
}

Then the menu will look like this: https://share.cleanshot.com/MxWmSd3t

Best Regards

0
F
Fion
Accepted Answer
11 months ago #175254

Furthermore,

Manufactuer Template v 2.1.0 updated on 27 October 2023 which show it is Joomla 5 & 4 compatible, HOWEVER at download template page https://www.joomshaper.com/downloads/template/manufacturer it show " Latest Version of Joomla v4.4.0 "

my website is Joomla 5.2.1 by php 8.2.25, can I use this template?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #175352

Yes, you can use Manufactuer Template v 2.1.0 there. It is Joomla 5 compatible but the download section mentions only Joomla 4 because the quickstart pack includes Joomla 4. You can simply download the quickstart pack, install and then update the Joomla version from 4 to 5. If you only want the template pack, then yes, you can do that in your Joomla 5 environment.

Thanks!

0
F
Fion
Accepted Answer
11 months ago #175258

Dear Rashida

From your image https://share.cleanshot.com/K1S3Y9p9 There is a HELIX ULTMATE 2.0.16 From here : https://snipboard.io/gL2UZ8.jpg I found 2 Helix template,

So should i first install one of the Helix template and its plugin before install manufacturer ? Or uninstall manufactuere template, then install one of hte Helix and reinstall manufactuer template again ??

Please advise me

FIon

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #175354

Hi Fion,

The Manufactuer Template is based on the Helix ultimate framework, so if you install the Manufactuer Template only then the template Option will be looking like what I have shared as screenshot there.

No worries:)

0
F
Fion
Accepted Answer
11 months ago #175467

Just update and install an extension System - Helix Ultimate Framework Plugin(enable) version 2.1.1 Date: 2018-02-01 by JoomShaper.com But I still cannot see any Helix edit page as your image at point 1 ! https://share.cleanshot.com/K1S3Y9p9 Also if your visit the site at below hidden content, you will get

behavior::caption not found.

is it all because the this template not work in Joomla 5.2.1 ? OR should I directly install Helix Ultimate Template or Helix3 Template (https://www.joomshaper.com/joomla-templates?search=Helix) ?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #175500

Hi,

Please follow this path: System>Site Templates Styles> Click on your current default template name then choose Template Options. Then find offcanvas position within the Navigation tab.

https://share.cleanshot.com/l9Rs5N18

https://share.cleanshot.com/LgpXygrv

https://share.cleanshot.com/yh9T3mTT

https://share.cleanshot.com/gVqfst2j

Please do let me know if you still unable to find them.

For the error behavior::caption not found you may follow this:

https://www.joomshaper.com/forum/question/30695

Best Regards

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #176112

Did that help?

0
F
Fion
Accepted Answer
11 months ago #176280

Dear Rashida

  1. having read your #175500, I still have no idea why "Behavior::caption Not Found." and how to avoid, I have tried to create an Joomla Article and let Menu EN > Home link to it , then it appear again, do you know on what bring out this question? Does it comes from template : manufacturer that other users all the time have problem then need your side to special edit some template php file to solve it, user by user?
    should this template need to be upgrade?

Urgent question as below about the template : manufacturer

  1. how to add a topbar on top of the Menu, I try to go to Helix > layout option, there are now row named "menu" that I can create a top1 layout on top of it to add language switcher | social icon | search icon in the topbar ?

  2. Menu bar : 2.1 where is the css located at that I can move menu item to right hand side and add language switcher at the right 2.2 I place a pre-text "aaa" to show I located the language switcher at Menu layout ( right of menu item) but as you see no language switcher can be shown, I need your help to teach me where I have wrong and help me to fixed it 2.3 I have many tables which use same table css (now put them into page css separatedly ). where can I create a single table.css and let each Sp Page 's Page css just @import this files, so that I can just edit one table.css and all those sp page has table can use this single css file 2.4 offcavas menu: how can I add grouped social icons under search box, where can I edit the offcanvs likes background color, add image, change menu item font size, acive or hover effect? should I create a offcavas.css and add class name at 3 (en, hk, cn) offcavas menu advance option. 2.5 refer to preview of manufacturer : how can we add "Business Partner" on each page ( add layout at Helix ? or custom module?) and allow my client just edit one source of "Business Partner" then every page of 3 languages can also see them?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #176386

Hi Fion,

I'm trying to answer your questions one by one:

2.1 Please check this: https://www.joomshaper.com/documentation/helix-framework/customization-tips#how-to-change-the-position-of-the-menu

I can see you have already added a language switcher module there. For more information please check the following documentation:

https://www.joomshaper.com/documentation/helix-framework/multilingual-site

2.2 Please check if every steps has been done carefully: https://www.joomshaper.com/documentation/helix-framework/multilingual-site

2.3 All custom CSS are recommended to keep in one file, that should be named as custom.css. Here is the related documentation:

https://www.joomshaper.com/documentation/helix-framework/custom-code-css-js-meta#custom-code-by-files

Then you can edit the same css from the same file.

2.4 First you need to add a module including social icons group at the offcanvas position. You will find some customization tips here: https://www.joomshaper.com/documentation/helix-framework/customization-tips#how-to-customize-offcanvas-menu

2.5 Couldn't understand this question. Can I have more details?

Best Regards

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #176416

One more thing,

Where should I find the error you have mentioned in point 1? Would you please, give me that url and admin access of that site.

Best Regards

0
F
Fion
Accepted Answer
11 months ago #176626

Dear Rashida

Thank you so much for your helpful links which I am working on point 2, and they works now I can see the lanugage switcher and now working hard on changing its css, will show you later on

for Pont 1. I have to show you the preview website site at hiddent content from which you can see I can put the language switch, social icon, search icon as this image : https://snipboard.io/uOx4ba.jpg manufacuter : template options > layout builder as this image : https://snipboard.io/icU2jl.jpg we cannot add any row on top of the Menu bar, as there is no layout show the position of the menu , I tried add a layour on top of Main Menu but it only show UNDER the menu.

Point 3 : I add a Site Module - Custom for "user 1" position named "footer img EN" "footer img HK" "footer img CN" so I add a new layout name "Section Partner" at Template Option > ayout builder, and assing "user 1" into it and at custom.css (.) I add below style to let it show in one horizontial row but FAILURE

div.mod-languages ul, .txt_footer, .partnerClass, .textLink { flex-direction: row; }

For current webiste (by JoomlArt template : ja property) which is 5 years ago (Joomla 3.x) Now we have to migrate into New website (Joomla 5.x) by (Sp Page Builder template : manaufacturer) and the design for new website (yours Sp Page Builder and template ) shoule be similar as the current website.

Here is the image for comparing two website business partner https://snipboard.io/cY5bRg.jpg

you can access the backend and search for site module with position "user 1" and see the source code ,

Please do help as I prefer using SP Page Builder rather than renew the service to use JoomlArt, because their reply are already lated , this is the main reason we wish to continue working with your helping hand.

Thanks indeed Rahida Rashida

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 11 months ago #176856

Hi Fion,

You're welcome:)

  1. You are using predefined header there. Please check how to create a custom header: https://www.joomshaper.com/documentation/helix-framework/custom-header

  2. Yes, you might need many css adjustment to make them look same, since there might be many differences such as bootstrap, fontawesome, etc versions.

Will look into the site module issue.

Best Regards

0
F
Fion
Accepted Answer
10 months ago #177568

Dear Rashida

Q. 1. Rashida, I really need your help to take action on directly edit the module "footer img EN" in position "user1", because I really do not know where is the mistake to make each image have a wide block that force each image show in a single row breaking the design as I show to you in below image link. Please do help me

Here is the image for comparing two website business partner https://snipboard.io/cY5bRg.jpg you can access the backend and search for site module with position "user 1" and see the source code,

https://ecib2.hkitconsult.com/administrator/index.php?option=com_modules&view=module&layout=edit&id=124&client_id=

Q.2, Thanks for your teaching on creating a customer header Now I have Section topBar, and Section Menu as https://ecib2.hkitconsult.com/index.php/en I create a custom layout "Section Topbar" insert "top1" position, but I try to add css to make language switcher, search box, soical icons in a single row and freeze at top position ( do not move upward when scroll down) , without success, https://snipboard.io/iNQCz8.jpg

would you mind also edit this part for me.

Thanks indeed

P.S. I am urgently need to present this new SP template to my client, now only these two part need your help. Please do help me

Thanks indeed

Fion

0