Join the Soledad Facebook Users Group here
for Share, assistance, discussion, and Updates related to Soledad WordPress Theme.

If you can't create a new ticket - you can send us an email via our contact form and we will get back to you.

Okay
  Public Ticket #3006249
Styling issues in RTL
Closed

Comments

  • ziedan started the conversation

    Dear Support team,

    Please I have purchased the Soledad theme, but I have a problem with the website as it is in Arabic.

    1. The problem is I have the search icon and search box of the homepage on the right, and it is overlapping with the menu icon as shown in the images below.
    2. When I open the menu, it is opening from the left, not the right, but it is supposed to be on the right in the RTL mode (shown in the 3rd image below).

    So please can you support helping in this issue?

    Thanks.

  •  2,491
    PenciDesign replied

    Hi,

    Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:

    .header-search-style-showup .penci_nav_left .show-search {
        right: 0;
        left: auto;
    } .header-search-style-showup .penci_nav_left .show-search::before {
        right: 5px;
        left: auto;
    } .penci-menu-hbg {
        width: 330px;
        transform: translateX(330px);
        -webkit-transform: translateX(330px);
        -moz-transform: translateX(330px);
    } .penci-menuhbg-open .penci-menu-hbg.penci-menu-hbg-left {
        left: auto;
        right: 330px;
    } .penci-menu-hbg,
    #sidebar-nav {
        left: auto;
        right: 0;
    }

    Regards,
    PenciDesign.



  • ziedan replied

    Thanks for the reply, it is working for the menu and it is from right now. But the search icon is so close to the menu icon (as shown below), can I add padding to it?

  •  2,491
    PenciDesign replied

    Hi,

    You can add the spacing to the search icon or any header elements by editing the header with Penci Header Builder. You can read the document here: https://soledad.pencidesign.net/soledad-document/#header-footer-builder

    Regards,
    PenciDesign.