Is it Elementor compatible?

Also one more question. Can we have sticky header in this theme.

Hey @jasmeetsingh,

1) Sinatra fully supports Elementor. Even Elementor Pro features are supported.

2) Multisite works as expected.

3) There isn’t a paid version of Sinatra theme, it’s completely free just like WordPress.

4) We don’t have the sticky header feature yet, but you can try with this CSS:

#masthead {
  position: sticky;
  top: 0;
  z-index: 9;
}

Add that CSS into the Customize ? Additional CSS field.

Thanks!

• This reply was modified 4 years, 8 months ago by Branko.

Thanks for the CSS code! It totally works. Love this theme!

Awesome.. I used to use one theme (I won’t mention name here :)) but then I came accross this one.. Great options with respect to the header customization. If possible pushing some footer customization will make this theme one of the best free themes. Like we have 4 and 3 grid option in the theme and all are equal in width. If possible we can have more options to define ourself the devision width. Or if we have 1 single grid option then we can insert our elementor section there. Just few options/suggestions ??

Anyways awesome theme.

Ah.. Just came back to see if we have this thing possible. Your code did work. But is it possible to keep only the main header sticky not the top header?

I have once done this with some other theme. Like on scroll js trigger adding class to main header and making it sticky. Just wondering if you have some better solution for this one.

Thanks in advance.

Hi @jasmeetsingh
Using the CSS code @brankoconjic provided, on my website, the top header is minimized (text removed) and sticky, along with the main header which is sticky. Not sure if it was supposed to do that but it looks nice. ??
Here’s how the code looks on my website: https://episcopalstmatthew.org
Cheers!

Hey @mlacey415 for sure that code is working awesome. Just the issue with mine is that my logo is square in shape. So main header takes good space. If on scroll main menu is sticky it will look awesome. But as soon as we have top bar+ main menu sticky then it takes good space when person is scrolling on the site. So there is little less space for user to have a view.

https://prnt.sc/t4nw7z (just started the site with this theme.. :))

Just if its possible to hide top bar on scroll.. it will be like awesome.

Hi @jasmeetsingh!

I see what you mean with your website/logo…I’m no programmer (obviously ??????) but one design option (until @brankoconjic is able to jump in with a coding/programming fix) is to modify the logo so the header logo is more horizontal.

One option might be to move the text “kioskid” and “art of skilling” to the right of the yellow object, while keeping the unique font of each (which goes well with your website’s topic btw). And putting a larger “k” in the same font as “kioskid” into the yellow circle object. Benefits to this additional logo design would be that your brand name and tagline would be more prominent all the time (it is hard to read “art of skilling” in the yellow circle and it is a good tagline!) and you would gain an additional “mini-logo”/branding icon that you can use as the profile pic for social media accounts like Facebook, Twitter, Instagram, etc.

Just a thought..and have a great day. ??

Hehe,
I do appreciate your suggestion. But you know what.. This business of my client is on since 3 years so they already have recognition with this logo. So changing logo design wont be possible. Anyways I will somehow find out the solution for this for sure.

Will post the solution here soon.. ??

Hey,

Sticky header without the top bar (and Page Title) would require a bit of JS, it’s not possible with CSS only.

Here’s a beta version of the sticky header feature:

Here’s the script:
https://gist.github.com/brankoconjic/54b85e8efcee6a97fb7831803f10903f

And the CSS:
https://gist.github.com/brankoconjic/99bd09b25f40e94fc44ebae745b3eaff

This will be added in the future.

Let me know if it worked for you ??

• This reply was modified 4 years, 8 months ago by Branko.

@jasmeetsingh,

We will include more Footer layouts in the next update.

Thank you for your suggestions.

@brankoconjic Awesome.. it worked awesomely.. You saved my around couple of days.. I would have invested in putting my brain into this.. lol

Thanks it worked awesomely..

Yeah that footer layout will spice things up in the theme..

Thanks man..

@jasmeetsingh You’re welcome!

I’d appreciate if you could leave a review ??

Sure.. deserves that..

Came back for one more issue.. i tried the site that I ws building in on IOS, (iphone & ipad) but u know issue is the font is different on ipads and iphones..

In android the fonts are different too.. while on desktop (windows the font are coming as I have set them..)

what can be the issue?

Hey @jasmeetsingh,

In order to keep the theme lightweight as much as possible we decided not to load additional fonts and instead use the default system fonts. Depending on which device you visit your site fonts might be different.

For example, for Windows the default system font is “Segoe UI”, for iOS and MacOS it’s “San Francisco”.

This only happens if “Default System Font” is selected in Appearance ? Customize ? General Settings ? Base Typography.

If you choose one of the Google Fonts that are listed there, the font should look exactly the same on all devices and systems.

Let me know if helped resolve your issue.

(I just want to mention that in General Settings ? Base Typography you can choose different fonts for Body – which will affect all elements and Headings – H1 – H6 elements only).

Thanks!

• This reply was modified 4 years, 7 months ago by Branko.