[Mahesh]

Hi @andrew90,

It won’t trouble you much setting width to 1260px, but you’ll need to fix the width of the content, sidebars etc in for responsive design.

Regards,
Mahesh

[Mahesh]

Hi @champac,

1. For hiding default search text on click, add the following CSS.

#masthead .search-field:focus::-moz-placeholder {
    color: transparent;
}
#masthead .search-field:focus::-webkit-input-placeholder {
    color: transparent;
}

2. Adding another button to the left along with the first one, you do not need to repeat the whole code I’ve given you above, it won’t work. Just adding modifying a line will fix the issue. In the above code, please Find the following line:
$output = '<a class="custom-btn" href="your-url" title="Title">Your Text</a>';
And Replace it with the following, two link buttons will be displayed.
$output = '<a id="custom-link-1" class="custom-btn" href="your-url" title="Title">Link 1</a><a id="custom-link-2" class="custom-btn" href="your-url" title="Title">Link 2</a>';

3. Add image to the button
I’m a bit confused on what you actually mean. Do you mean background or the icon as image? Please clarify on this.

Let me know if any problem.

Regards,
Mahesh

[Mahesh]

Hi @osPriya,

Catch Responsive provides Featured Content for pages only. Since pages don’t have categories I’m afraid above is not possible in Catch Responsive Free version for dynamic category links. You can upgrade to pro version for more features in Featured Content such as Posts, Post within selected Categories, Widget and Images (with custom links).

Regards,
Mahesh

[Mahesh]

Hi @marga,

Go to “Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS” and add the following CSS.

.page-id-21 .entry-content {
    font-size: 20px
}

Note: Please adjust the font-size as desired.

Regards,
Mahesh

[Mahesh]

Hi @champac,

For this you’ll need to create a child theme. You can find more details on creating child theme HERE. Then in child theme’s functions.php add the following codes.

function catchresponsive_get_social_icons(){
	if( ( !$output = get_transient( 'catchresponsive_social_icons' ) ) ) {
		$output	= '';

		$output	= '<a class="custom-btn" href="your-url" title="Title">Your Text</a>';

		$options 	= catchresponsive_get_theme_options(); // Get options

		//Pre defined Social Icons Link Start
		$pre_def_social_icons 	=	catchresponsive_get_social_icons_list();

		foreach ( $pre_def_social_icons as $key => $item ) {
			if( isset( $options[ $key ] ) && '' != $options[ $key ] ) {
				$value = $options[ $key ];

				if ( 'email_link' == $key  ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr__( 'Email', 'catch-responsive') . '" href="mailto:'. antispambot( sanitize_email( $value ) ) .'"><span class="screen-reader-text">'. __( 'Email', 'catch-responsive') . '</span> </a>';
				}
				else if ( 'skype_link' == $key  ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr( $item['label'] ) . '" href="'. esc_attr( $value ) .'"><span class="screen-reader-text">'. esc_attr( $item['label'] ). '</span> </a>';
				}
				else if ( 'phone_link' == $key || 'handset_link' == $key ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr( $item['label'] ) . '" href="tel:' . preg_replace( '/\s+/', '', esc_attr( $value ) ) . '"><span class="screen-reader-text">'. esc_attr( $item['label'] ) . '</span> </a>';
				}
				else {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr( $item['label'] ) .'" href="'. esc_url( $value ) .'"><span class="screen-reader-text">'. esc_attr( $item['label'] ) .'</span> </a>';
				}
			}
		}
		//Pre defined Social Icons Link End

		//Custom Social Icons Link End
		set_transient( 'catchresponsive_social_icons', $output, 86940 );
	}

	return $output;
}

Note: Please edit the following line in the above code as required
$output = '<a class="custom-btn" href="your-url" title="Title">Your Text</a>';
Replace your-url, title and Your Text with link, title and button text respectively.

Then go to “Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS” box and add the following CSS.

.custom-btn {
    background-color: grey;
    border-radius: 5px;
    color: #000;
    padding: 3px 5px;
    margin: 5px 0 0 5px;
    display: inline-block;
}

.custom-btn:hover {
    text-decoration: none;
}

Note: You can change the styles above as you desired.

Regards,
Mahesh

[Mahesh]

Hi @Didier,

I tried it on the firefox browser in desktop and resized the screen.

Regards,
Mahesh

[Mahesh]

Hi @andrewf90,

No, Catch Flames does not have max-screen width set. But yes .wrapper class has width set to 1260px.
Let me know if I can help you further.

Regards,
Mahesh

[Mahesh]

Hi @andrewf90,

Yes → is supposed to be displayed as arrow. It is working fine on our server. It is working both in More Tag Text and Default Display Text in Search. No Custom CSS is necessary for this. Have you made any changes to the code?

Let me know any further.

Regards,
Mahesh

[Mahesh]

Hi @americaontwowheels,

Yes, you can achieve it with Custom CSS. Go to “Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS” box and add the following CSS.
1. For footer-left-content

.copyright {
    font-size: 15px;
}

2. For footer-right-content

.powered {
    font-size: 15px;
}

Note: Please change the values for font-size as per required.

Regards,
Mahesh

[Mahesh]

Hi @[email protected],

Seems you have found the plugin and you’ve made it working to fix your issue.
Have a nice day!

Regards,
Mahesh

[Mahesh]

Hi @DJ,

Thank you for your appreciation.

Regards,
Mahesh

[Mahesh]

Hi @Cattext,

Thank you for your appreciation.
Have a nice day.

Regards,
Mahesh

[Mahesh]

Hi @rflores,

That’s great! 🙂
Thank you for your appreciation.
Have a nice day.

Regards,
Mahesh

[Mahesh]

Hi @Jos,

Thank you for your appreciation.

Regards,
Mahesh

[Mahesh]

Hi @americantwowheels,

That’s great. Have a nice day!

Regards,
Mahesh

[Mahesh]

Hi @shana-shanti,

The background issue is because of the CSS that you have in your Custom CSS:
#main { background-color: #ffffff; }
Please find and remove it from Custom CSS, then you’ll have your custom background back.
And for the sliders, it seems some plugins is causing the issue, please try deactivating one by one and check it.

Let me know further.

Regards,
Mahesh

[Mahesh]

Hi @Kath Wayne-Spindler,

Thank you for upgrading to Catch Evolution Pro.
What error do you get?
You can either upload via WordPress admin panel or FTP. Please refer to this link: Catch Flames Pro Installation.

Let me know if any problem.

Regards,
Mahesh

[Mahesh]

Hi @ibrahim,

Thank you for using Catch Evolution Pro.
The above can be achieved with Custom CSS. Go to “Dashboard=> Appearance=> Theme Options=> Custom CSS” box and add the following CSS.
1. Resize content and right sidebar.

@media screen and (min-width: 1225px) {
	.three-columns #primary {
    		width: 630px;
	}

	.three-columns #secondary {
    		width: 260px;
	}
}

@media screen and (min-width: 1061px) and (max-width: 1224px) {
	.three-columns #primary {
    		width: 494px;
	}

	.three-columns #secondary {
    		width: 230px;
	}
}

@media screen and (min-width: 1025px) and (max-width: 1059px) {
	.three-columns #primary {
    		width: 440px;
	}

	.three-columns #secondary {
    		width: 200px;
	}
}

Note: You may change the width as required.

2. Close the space between the post.

#content .hentry {
	border-bottom: none;
	margin-bottom: 0;
}

#content .hentry:last-of-type {
	border-bottom: 1px solid #ddd;
	margin-bottom: 40px;
}
  
@media screen and (min-width: 1061px) and (max-width: 1224px) {
	#content .hentry:last-of-type {
		margin-bottom: 30px;
	}
}
  
@media screen and (max-width: 676px) {
	#content .hentry:last-of-type {
		margin-bottom: 15px
	}
}

Regards,
Mahesh

[Mahesh]

Hi @champac,

For placeholder’s color changing only, replace the following CSS

#masthead .search-field {
    color: #0000ff;
}

with the following CSS:

#masthead .search-field::-moz-placeholder {
    background-color: #00ffff;
    color: #ffff00;
}
#masthead .search-field::-webkit-input-placeholder {
    background-color: #00ffff;
    color: #ffff00;
}

What type of button do you want to add and where, please clarify more.
Let me know if this helped.

Regards,
Mahesh

[Mahesh]

Hi Didier,

1. To make the menu text white, use this CSS.
#hgroup-wrap .sb-holder a {
color: #fff;
}

2. In view with width 569px to 767px, there are two menu showing and this is not good. The following CSS will give hide one menu till 569px and the displays the mobile menu (.sb-holder) normally in the mobile view.

Let me know if this solved your issue.

Regards,
Mahesh

[Author]

Posts