Categories Widget size

Travelify
1

Congrats for an excellent theme!
Is there any chance of changing the size of the widgets if i use just right position for them? (www.sacalatorim.ro) I would like to narrow them down?

Thank you!

2

What you mean by changing size? If you would like to make them bigger, you have to make something smaller, such as padding around content area and sidebars or even content area itself. If you want to make them smaller, then you have to change content area larger and create a new thumbnail size for that as well.

What changes exactly you are looking to make?

3

Now the width of the widget is to big. Can I make it narrow? For example, now I use Categories and Links as right side widgets and they are too wide. Thank you!

4

Add this to Theme Options - Other - Custom CSS

#secondary {
    width: 20%;
}
#primary {
    width: 76%;
}

Unfortunately, it doesn’t stop there and you will have to create a new featured image size via functions.php file. Current image size is defined like this

add_image_size( 'featured', 670, 300, true );

but now you will need something like

add_image_size( 'featured', 735, 350, true );

And also you will have to regenerate all thumbnails because WordPress won’t do it automatically for existing images. For that you can use this plugin.

5

Thank you. It works great!
Another question: I know the theme is responsive but on mobile (samsung) is not. The thumbnail pictures in the article are not and the front page doesnt display the “articles” as width like the slider. Shall i do something?

6

Theme is fully responsive on mobile and you can see it on our theme demo: https://colorlib.com/travelify/

What other customizations you have done other than changing layout width? There are some other changes that holds it back from being responsive on your website as well.

7

This is all I have added:

.social-icons {
    position: relative;
    z-index: 0;
}
.hgroup-right {
    margin-top: 0px;
}
.hgroup-wrap {
	padding-top: 0px;
	padding-bottom: 0px;
}
.hgroup-right {
	float: right;
	margin-top: 0px;
}
.social-icons ul li a {
		font-size: 24px;
}
form.form-search {
    width: 350px;
}
.widget-title {
    font-weight: bold;
}
#secondary {
    width: 20%;
}
#primary {
    width: 76%;
}
  1. Last question - i hope - is if i can get read of the following text after the comments:
    You may use these HTML tags and attributes: <abbr title=“”> <acronym title=“”> <b>
    <cite> <i> <q cite=“”> <strike>

T H A N K Y O U!
8

Then replace my previously give code with this one:

@media (min-width: 767px) { 
	#secondary {
    width: 20%;
	}
	#primary {
	    width: 76%;
	}			
}

Add add this to hide information about allowed HTML formatting in comments

.form-allowed-tags {
    display: none;
}
9

Working! Thank you very much! In the front page, the pictures of each article are into the frame without any other extra space and this is perfect.

10

Hello again! Is possible to add something to CSS in order not to have anymore “you may use HTML tags and attributes”? On the desktop version are hidden but on mobile they are still there. Thank you!

11

Add this to the same Custom CSS field inside Theme Options.

#respond form p.form-allowed-tags {
    display: none;
}