Search Results for 'sidebar'

[nico2]

nico2

#202732

Hi support team!
Sometimes, I use blog posts without showing the sidebar on my blog. For example on this trip report:
-> *Login to see link o/durch-ein-namenloses-couloir-auf-den-barkarkolla/

In the future I want to embedde Youtube videos responsive. I tried different possebility, like the Kadence shortcode and a short css code to add a special container:
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

On normal blog posts with displayed sidebar the css container works and the clip is responsive. Here you can find an example:
-> *Login to see link o/da-war-alles-dabei-auf-den-galenstock-ueber-den-suedostgrat/
On blog posts without displayed sidebar the Youtube clip is not shown. You can find it in the source code of the page but its position is “sowewhere over the rainbow”. 😉

Can you give me an advice which is the best way to embedde youtube clips responsive in Virtue theme with and without sidebar? For this topic I miss a special article in the Knowledge Base. 😉
Thanks in advance and best regards!

nico

[nico2]

nico2

#202732

Hi support team!
Sometimes, I use blog posts without showing the sidebar on my blog. For example on this trip report:
-> *Login to see link o/durch-ein-namenloses-couloir-auf-den-barkarkolla/

In the future I want to embedde Youtube videos responsive. I tried different possebility, like the Kadence shortcode and a short css code to add a special container:
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

On normal blog posts with displayed sidebar the css container works and the clip is responsive. Here you can find an example:
-> *Login to see link o/da-war-alles-dabei-auf-den-galenstock-ueber-den-suedostgrat/
On blog posts without displayed sidebar the Youtube clip is not shown. You can find it in the source code of the page but its position is “sowewhere over the rainbow”. 😉

Can you give me an advice which is the best way to embedde youtube clips responsive in Virtue theme with and without sidebar? For this topic I miss a special article in the Knowledge Base. 😉
Thanks in advance and best regards!

nico

[Ben Ritner]

Ben Ritner

#202729

Look at page-sidebar.php in the theme folder for an example.

Ben

[Max]

Max

#202501

Is there a way to add a Testimonial Carousel into a Product Tab? A shortcode of some kind? I know I can add it into the Product Description using SiteOrigin, but that only seems to be available for that first tab.

Also, when I did add one to the Product Description using a widget in SiteOrigin, it did not rotate. This may have been because there was another testimonial carousel widget in the sidebar – some kind of conflict there?

[Max]

Max

#202501

Is there a way to add a Testimonial Carousel into a Product Tab? A shortcode of some kind? I know I can add it into the Product Description using SiteOrigin, but that only seems to be available for that first tab.

Also, when I did add one to the Product Description using a widget in SiteOrigin, it did not rotate. This may have been because there was another testimonial carousel widget in the sidebar – some kind of conflict there?

[Isaac]

Isaac

#202360

On the mobile platform, I do not like the big dark arrows on either side of the flex slider, that is at the top of my home page, as they interfere with the menu icon. Is there a way to turn off the arrows? Mobile format is the problem, it looks good on a desktop…

site in question is http://www.macadamgrinding.com

I tried searching the forum and came across this post: *Login to see link I tried entering the code but the arrow buttons did not go away. Do note that I am using custom css code already to get Gutenburg photos to center correctly in max width. My code looks like this:

.main:not(.kt-sidebar) .entry-content .alignwide {
max-width: none;
}

@media (max-width: 992px) {
.flex-control-nav {
display: none;
}
}

[Isaac]

Isaac

#202360

On the mobile platform, I do not like the big dark arrows on either side of the flex slider, that is at the top of my home page, as they interfere with the menu icon. Is there a way to turn off the arrows? Mobile format is the problem, it looks good on a desktop…

site in question is http://www.macadamgrinding.com

I tried searching the forum and came across this post: *Login to see link I tried entering the code but the arrow buttons did not go away. Do note that I am using custom css code already to get Gutenburg photos to center correctly in max width. My code looks like this:

.main:not(.kt-sidebar) .entry-content .alignwide {
max-width: none;
}

@media (max-width: 992px) {
.flex-control-nav {
display: none;
}
}

[Ben Ritner]

Ben Ritner

#202268

So the above css if for align wide. You are using align full so the css would be:

.main:not(.kt-sidebar) .entry-content .alignfull {
    max-width: none;
}

Please note that aligning wide and full is designed to stretch the images not center them.

Ben

[Hannah]

Hannah

#202215

As I said above, there isn’t an option to move the sidebar to the top on mobile. Would you like to try what I suggest above? Let me know if so and I would be happy to help with the css.

Hannah

[Vladimir]

Vladimir

#202204

The problem is that the filters in the basement are not visible, due to the infinity loading.
Maybe you know, how to move the sidebar to top on mobile with CSS?
It will be great!

[Hannah]

Hannah

#202202

Hey,
Unfortunately, there isn’t a built-in function for this. You can use css to remove the sidebar from mobile view. Then you can add your sidebar content to your content area and use css and media queries to only show that in mobile. Would that work for you? Let me know and I can help with the css.

Hannah

[Vladimir]

Vladimir

#202199

Hello Kadence team!
Tell me please, how I can move sidebar higher on mobile?
*Login to see link ine/shop/
Need to first- sidebar, next- goods.

[Vladimir]

Vladimir

#202199

Hello Kadence team!
Tell me please, how I can move sidebar higher on mobile?
*Login to see link ine/shop/
Need to first- sidebar, next- goods.

[Isaac]

Isaac

#202197

Hello – I tried entering this

.main:not(.kt-sidebar) .entry-content .alignwide {
max-width: none;
}

As per a previous post found on the support forums. However, my images are still not aligning center in full width… Any suggestions?

[Isaac]

Isaac

#202197

Hello – I tried entering this

.main:not(.kt-sidebar) .entry-content .alignwide {
max-width: none;
}

As per a previous post found on the support forums. However, my images are still not aligning center in full width… Any suggestions?

[Ciprian Popica]

Ciprian Popica

#202195

Hi guys,

First I want to thank Ben and Kevin for replying to me so fast on this topic. I discovered the option of having the pages content width as full width or content. I loved the width style and wanted to use it, but noticed that the titles and other things were not as wide as the rest of the content. I also wanted to have the entire website pages wide so I asked for some help and got the following codes that helped me fix the issue.

.container {width: 100%;padding-left:5%;padding-right:5%;}

.contactform input.full, .contactform textarea {max-width: 100%;}

.sidebar .form-search {width: 100%;max-width: none;}

The website I’m working on is earthxplorer.ro

I still have some issues I would like to change / fix and I could use some help:

1. The search widget in the header it’s not acting properly when clicked ( the search in the main menu icon ),
2. The blog featured images are a little strange and I would like them to cover the box as they normally do,
3. There is any way to change the height of the portrait featured image as now with the wide content it’s way too high,
4. If in the main menu I add more than six items, when I minimize the browser page to a smaller resolutions, the menu items are acting strange as well.

Thank you in advance for all the support. The website started looking as I want to, and it’s the same for my two other websites.

[Ciprian Popica]

Ciprian Popica

#202195

Hi guys,

First I want to thank Ben and Kevin for replying to me so fast on this topic. I discovered the option of having the pages content width as full width or content. I loved the width style and wanted to use it, but noticed that the titles and other things were not as wide as the rest of the content. I also wanted to have the entire website pages wide so I asked for some help and got the following codes that helped me fix the issue.

.container {width: 100%;padding-left:5%;padding-right:5%;}

.contactform input.full, .contactform textarea {max-width: 100%;}

.sidebar .form-search {width: 100%;max-width: none;}

The website I’m working on is earthxplorer.ro

I still have some issues I would like to change / fix and I could use some help:

1. The search widget in the header it’s not acting properly when clicked ( the search in the main menu icon ),
2. The blog featured images are a little strange and I would like them to cover the box as they normally do,
3. There is any way to change the height of the portrait featured image as now with the wide content it’s way too high,
4. If in the main menu I add more than six items, when I minimize the browser page to a smaller resolutions, the menu items are acting strange as well.

Thank you in advance for all the support. The website started looking as I want to, and it’s the same for my two other websites.

[Kevin]

Kevin

#201947

Hello,

The page doesn’t seem to be loading.

Try adding this CSS to THeme Options> Custom CSS, and let me know if it works for you:

.tax-product_cat aside#ktsidebar {
    display: none;
}

.tax-product_cat .main {
    width: 100%;
}

-Kevin

[Nikita]

Nikita

#201914

Hello! How could I hide the sidebar on the category page? for example I want to hide the sidebar here *Login to see link I hope You help me, Thank you

[Nikita]

Nikita

#201914

Hello! How could I hide the sidebar on the category page? for example I want to hide the sidebar here *Login to see link I hope You help me, Thank you

[Ben Ritner]

Ben Ritner

#201663

Hey,
Gutenberg is changing a lot so it’s just a css adjustment we will make with the next version. Here is what you can add right now into your theme options > custom css box:

.main:not(.kt-sidebar) .entry-content .alignwide {
    max-width: none;
}

Ben

[v.stishenok]

v.stishenok

#201297

Hi there!

First of all, thank you for a beautiful and powerful theme! I enjoy working with it ever since my purchase but there are a few issues I can’t solve myself due to little to no knowledge of CSS. I gathered all of questions together to ask everything at once so here they are.

1. Social links widget. How can I change the order of icons to display? For example, I need VK to be the first one but I can’t see any drag-and-drop possibilities.

2. Social links widget. How can I make borders od the icons round instead of square?

3. Social links widget AND Testimonial carousel widget. How can I change color of the borders in those two widgets from grey to the one I need?

4. Payment method icons widget. How can I add different images to display in this widget? There are a few local payment methods that should be displayed and that are obviously missing by default.

5. Buttons. How can I change style of the text that appears on the buttons by default? If I need to add button (even in the widgets that supports such option) text always has the same style which I need to change at least as it’s too bold.

6. Padding. I’m using KT simple share on my pages and while on mobile there are no space at all between share icons and sidebar. How can I add a bit of space between them so that page looks a bit more composed?

7. Header and menu. I use a secondary menu which is pinned and always remained on top while scrolling down. If I use Elementor to create pages everything works fine but if I activate Elemetor Pro there is always the same issue as my header (menu to be precise) is overlapping by the content and that shouldn’t be the case. Once I deactivate Elementor Pro, everything works fine. It seems like with activation of the plugin header is no longer “seen” and content of every page overlapping it while scrolling. I’ve already contacted plugin support but they unfortunately said they can’t do anything with that and I should contact theme developer to solve this.

Sorry for a big amount of questions but it’s better to have them in one place rather than bother you every day. Hopefully it won’t be too time consuming for you as most of them requires CSS customization which is definitely one of your strong sides.

Thank you!

Kind regards,
Vladimir

[v.stishenok]

v.stishenok

#201297

Hi there!

First of all, thank you for a beautiful and powerful theme! I enjoy working with it ever since my purchase but there are a few issues I can’t solve myself due to little to no knowledge of CSS. I gathered all of questions together to ask everything at once so here they are.

1. Social links widget. How can I change the order of icons to display? For example, I need VK to be the first one but I can’t see any drag-and-drop possibilities.

2. Social links widget. How can I make borders od the icons round instead of square?

3. Social links widget AND Testimonial carousel widget. How can I change color of the borders in those two widgets from grey to the one I need?

4. Payment method icons widget. How can I add different images to display in this widget? There are a few local payment methods that should be displayed and that are obviously missing by default.

5. Buttons. How can I change style of the text that appears on the buttons by default? If I need to add button (even in the widgets that supports such option) text always has the same style which I need to change at least as it’s too bold.

6. Padding. I’m using KT simple share on my pages and while on mobile there are no space at all between share icons and sidebar. How can I add a bit of space between them so that page looks a bit more composed?

7. Header and menu. I use a secondary menu which is pinned and always remained on top while scrolling down. If I use Elementor to create pages everything works fine but if I activate Elemetor Pro there is always the same issue as my header (menu to be precise) is overlapping by the content and that shouldn’t be the case. Once I deactivate Elementor Pro, everything works fine. It seems like with activation of the plugin header is no longer “seen” and content of every page overlapping it while scrolling. I’ve already contacted plugin support but they unfortunately said they can’t do anything with that and I should contact theme developer to solve this.

Sorry for a big amount of questions but it’s better to have them in one place rather than bother you every day. Hopefully it won’t be too time consuming for you as most of them requires CSS customization which is definitely one of your strong sides.

Thank you!

Kind regards,
Vladimir

[Hannah]

Hannah

#201283

Hi Stevensm,
Try adding this to your custom css box in Theme Options > Advanced Settings:

.sidebar .widget_nav_menu {
    border: 1px solid #000;
    padding: 10px;
}

Does that work for you?

Hannah

[phil2]

phil2

#201252

Thanks Ben, that is waaaaaaay better!

I also like that you have added more sense to the sequence by moving the the search box down below the title.

I have added a section to output “You searched for…” but I don’t understand the reference to “twentyfifteen” in the followoing statement:
<?php printf( __( 'Search Results for: "%s"', 'twentyfifteen' ), $query ); ?>

1. How would I replace that for Virtue?

2. The sidebar is output at the bottom of the page. Is it straightforward to set the container so that the sidebar appears in the usual place (right hand side for this site)?

3. I note that the results are displayed in a list and I need to work on this to get them into a grid with the image from the respective sdm_download CPT. Any pointers you can give here?

Very many thanks for this, it’s already looking so much better.
Kind regards,
Phil.

[pedro]

pedro

#201201

I can not get results, could it be that the other codes intervene with the new codes? But basically I need that in the home is 0 and in the rest of pages the value goes up between 5 or 7 … thanks

web: oropel.org

PD: my css code:

.pt-cv-readmore {
    color: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: none !important;
}
#content {
    padding-top: 0;
}
.sidebar .widget-title {
    text-transform: uppercase;
}
.home .contentclass {
    padding-top: 0;
}
.contentclass {
    padding-top: 5;
}

[stevensm]

stevensm

#201193

Hi,

I would like to place a border around my Navigation Menu that sits in my Primary Sidebar.

I don’t want any other items in my sidebar to have borders. Is this possible?

Regards,

[stevensm]

stevensm

#201193

Hi,

I would like to place a border around my Navigation Menu that sits in my Primary Sidebar.

I don’t want any other items in my sidebar to have borders. Is this possible?

Regards,

[Ben Ritner]

Ben Ritner

#201134

Hey,
Here is the css I added for the menu:

@media (min-width: 992px) and (max-width:1200px) {
    .kad-header-right {padding-left:0;}
    .kad-header-right #nav-main ul.sf-menu a {font-size: 21px;}
}

The footer is broken by your html, css isn’t going to fix this correctly because your html has divs that are not closed and you are containing content inside divs that are 7px tall and forcing overflows. This is all through your child theme through the footer template you are editing.

I can’t edit and fix your html without ftp access. So here is a simple hack fix for your html that will at least get it working correctly, from lines 99 to the end of the file you should replace the html with this:

 <div class="footerbase">
        	<div class="container">
        		<div class="footercredits clearfix">
       				
					<div class="double row"></div>  
    		
    		<?php if (has_nav_menu('footer_navigation')) :
        	?><div class="footernav clearfix">
			 <div align="right"><a href="https://kentuckypeerless.com/">HOME</a> - <a href="https://kentuckypeerless.com/product/distillery-tour-louisville/">VISIT</a> - <a href="https://kentuckypeerless.com/our-story/the-peerless-timeline/">STORY</a> - <a href="https://kentuckypeerless.com/shop/">SHOP</a> - <a href="https://kentuckypeerless.com/news/">NEWS</a> - <a href="https://kentuckypeerless.com/contact/">CONNECT</a></div>
			<?php 
              wp_nav_menu(array('theme_location' => 'footer_navigation', 'menu_class' => 'footermenu'));
            ?>
                   
            </div><?php
        	endif;?>
            <div class="footernavtag">           
					<?php dynamic_sidebar('footer_2'); ?><div style="margin:-34px 0px 0px 200px;"><img src="https://kentuckypeerless.com/wp-content/uploads/2018/06/DSP-KY-50.png"/></div>
        	</div>
        </div><!-- credits -->
		<div class="double row"></div>
		<div class="footernavtag2"> 		
				 <center><h6>PEERLESS KENTUCKY STRAIGHT BOURBON & RYE WHISKEY, DISTILLED AND BOTTLED BY KENTUCKY PEERLESS DISTILLING CO. IN LOUISVILLE, KENTUCKY.</h6></center>
				 <center><h6>PEERLESS IS A REGISTERED TRADEMARK. ALL RIGHTS RESERVED, THIS MATERIAL IS INTENDED FOR THOSE ABOVE THE LEGAL DRINKING AGE.</h6></center>
				 <center><h6>&copy; KENTUCKY PEERLESS DISTILLING COMPANY • 120 NORTH 10TH STREET, LOUISVILLE KENTUCKY • PRODUCT OF U.S.A</h6></center>	 
				 <center><h3><img src="https://kentuckypeerless.com/wp-content/uploads/2018/06/a-l-b.png"/>SAVOR SLOWLY . SIP RESPONSIBLY.<img src="https://kentuckypeerless.com/wp-content/uploads/2018/06/a-r-b.png"/></h3></center>	 
			</div>
    </div><!-- container -->	
	</div>
</footer>

Then after that you could add this css:

@media (max-width: 992px) {
.footernav div {
    text-align: center;
}
footer#containerfooter {
    text-align: center !important;
}
.footernavtag {
    width: 100%;
    float: none;
    margin-left: 0;
}
.footernav ul li {
    float: none;
    margin-right: auto;
    margin-left: auto;
    display: inline-block;
}
.footernav.clearfix {
    float: none;
    margin-right: 0;
}

.footernav ul#menu-footer-navagation {
    float: none;
    padding: 0;
}

.footernavtag .widget-first {
    margin-top: 10px;
    padding-bottom: 10px;
}

}
#containerfooter {
    padding-top: 40px;
}
.footercredits {
    padding: 0;
}
.footernavtag2 {
    width: 100%;
    float: none;
    margin-top: 20px;
}
.footernavtag2 h6 {
    float: none;
    line-height: 14px;
    margin: 0;
}
#containerfooter .double.row {
    margin-bottom: 0;
}

That is still a really messy way to go about what your are doing but at least that owuld be valid html and work and be responsive.