Skip to content

Instantly share code, notes, and snippets.

@yratof
Last active June 6, 2019 07:15
Show Gist options
  • Save yratof/6071755 to your computer and use it in GitHub Desktop.
Save yratof/6071755 to your computer and use it in GitHub Desktop.
Contact Form 7 - Removing the unwanted stuff, Making it look pretty, then reading the needed stuff
/*********************
Contact Form 7 Styles -
If you want to leave these colours as they are, then do so,
otherwise, wap grey and green for your brand colours in your MIXINS file
*********************/
$dark: rgb(50,50,50);
$green: rgb(0,200,100);
div.wpcf7 {
margin: 0;
padding: 0;
}
div.wpcf7-response-output {
clear: both;
float: right;
font-size: 0.8em;
margin: 0;
padding: 9px 20px;
width: 100%;
}
div.wpcf7-mail-sent-ok {
background: #398f14;
color: #fff;
}
div.wpcf7-mail-sent-ng {
background: #ff0000;
color: #fff;
}
div.wpcf7-spam-blocked {
background: #ffa500;
color: #fff;
}
div.wpcf7-validation-errors {
background: #DB5354;
color: #fff;
border: 0;
}
span.wpcf7-form-control-wrap {
position: relative;
}
span.wpcf7-not-valid-tip {
background: none repeat scroll 0 0 #DB5354;
color: #FFFFFF;
font-size: 10pt;
left: 0;
padding: 11px 5px;
position: absolute;
top: -9px;
width: 100%;
z-index: 100;
}
span.wpcf7-not-valid-tip-no-ajax {
color: #f00;
font-size: 10pt;
display: block;
}
span.wpcf7-list-item {
margin-left: 0.5em;
}
.wpcf7-display-none {
display: none;
}
div.wpcf7 img.ajax-loader {
border: none;
vertical-align: middle;
margin-left: 4px;
}
div.wpcf7 .watermark {
color: #888;
}
.wpcf7-textarea{
resize: none;
height:100px;
padding-top: 40px;
}
.wpcf7-text, .wpcf7-textarea {
width: 100%;
border: 1px solid darken($white, 30%);
color: $dark;
padding: 10px;
box-shadow inset 0 2px 1px fade-out(darken($white, 30%),0.8);
border-radius: 3px;
}
.wpcf7-submit{
@include transition(all 0.2s $ease-in-out-quart);
padding: 10px 35px;
border: 1px solid darken($green, 10%);
background: $green;
color: $white;
border-radius: 2px;
text-shadow: 0 -1px 1px darken($green, 30%), 0 1px 0px fade-out(darken($green, 30%), 0.9);
box-shadow: 0 3px darken($green, 10%);
text-transform: uppercase;
@include font-size(22);
font-weight: 700;
letter-spacing: 0.025em;
margin-bottom: 16px;
&:active{
box-shadow: 0 0px darken($green, 10%);
margin: 3px 0 13px;
}
}
<?php /*Template Name: Something */ get_header();
if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
wpcf7_enqueue_scripts();
//wpcf7_enqueue_styles(); /styles have been added to your normal styles
}
// What this does is enqueue's the contact form script again so CF7 works on the fly
?>
## THIS REMOVES CONTACT FORM 7 BULK FROM EVERY PAGE
## By default, contact form 7 adds the js and css to every page
## in wordpress, which is bulky, so we remove it.
define('WPCF7_LOAD_JS', false);
define('WPCF7_LOAD_CSS', false);
@Sunil-saha
Copy link

its not working

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment