- This topic has 3 replies, 2 voices, and was last updated 5 years, 9 months ago by
Support. This post has been viewed 1079 times
-
AuthorPosts
-
October 2, 2020 at 5:12 pm #10034681
taqigates
ParticipantI made https://www.rawatmakan.com website using Porto HTML theme. Everything seems good but my website is not responsive.
Please suggest me what can be done to make it complete responsive.
Template Version: 8.0October 2, 2020 at 11:14 pm #10034684Support
KeymasterHello,
1) For the slider texts you can use responsive levels of slider. You can try increase the font size on mobile screen. You can control the font size of each slide layer trough data-fontsize=”[‘xx’,’xx’,’xx’,’xx’]” attribute. For example:
data-fontsize=”[’22’,’22’,’22’,’40’]”
This is the same as:
– font size of 22px at mobile screens
– font size of 22px at tablet screens
– font size of 22px at large/laptop screens
– font size of 40px at extra large/desktop screensYou can use these responsive levels for all layers inside the revolution slider. For example to have different positions on each screen:
data-x=”center” data-hoffset=”[‘125′,’125′,’125′,’215’]” data-y=”center” data-voffset=”[‘-50′,’-50′,’-50′,’-75′]”
Learn more about Revolution Slider responsive setup here:
2) It’s missing the HTML code to show mobile menu button. Add the HTML code below side a side with
<div class="header-nav-main.......". For example:... .... ....... <div class="header-nav header-nav-links order-2 order-lg-1 justify-content-center"> <div class="header-nav-main header-nav-main-square header-nav-main-effect-2 header-nav-main-sub-effect-1">............</div> <button class="btn header-btn-collapse-nav" data-toggle="collapse" data-target=".header-nav-main nav"> <i class="fas fa-bars"></i> </button> </div> .. ..... ........3) IN the section below:

Change the class
pr-5topr-lg-5.4) In the section below has a white space:

This is being caused because you are defining max-width. You should remove this max-width in the HTML source code. Instead of it you can create a custom class and apply only on big resolutions. For example:
HTML:
<div class="custom-max-width-110px"> <img src="images/al-hashar.png" alt="Al Hashar Group"> </div>Add in (css/custom.css):
@media(min-width: 992px) { .custom-max-width-110px { max-width: 110px; } }5) In the section below:

Remove the code marked with red square.
We hope this helps!
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
October 4, 2020 at 3:40 pm #10034691taqigates
ParticipantCan you please check now, the menu button is not working.
October 6, 2020 at 12:06 am #10034704Support
KeymasterHello,
We replied for you about that in the other ticket you opened:
Please check there.
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
-
AuthorPosts
This topic is marked as "RESOLVED" and can not rceive new replies.