Give me the CSS for the "submit button". I'd like to change the position of the "submit button" for each Wordpress Page. For each Page (each contact-form), I'd like to show the button at "center-aligned" or "left-aligned".

Thank you for your inquiry. The default "submit button" of this plugin is "centered". Even if you don't do anything, the button is displayed on the "Confirmation Window" ("screen for confirming the contents of submission") right below the "confirmation-table of submission contents", exactly at the center of the table. I know. If you have created a "button for confirming contact-details" on the "form html page" with "left alignment", the same design button will appear in the eyes of the person trying to send an inquiry to you, the wording has changed from "Confirm" to "Send", and it should look like "Moved to the middle of Window".

Therefore, here, we will show you only the "left-aligned" method.

This plugin assigns the class "btn_confirm" to the "submit button". It means "the button displayed on the Confirmation Window". This "button displayed on the Confirmation Window" is in the "dedicated div for displaying the submit button" with the id "apcf_confirmation_btn". We create "left-aligned" button-design by combining these two elements.

How to align the submit button to the left

(1) Open "allpost-contactform.css".

* If you take out "allpost-contactform.css" from the plugin-dir (/wp-content/plugins/allpost-contactform) and move it to your theme-dir and load it independently in the theme, open the CSS-file in your theme.

(2) Open the "confirmation/send Page" (the page linked with the contactform-html Page and pasted the shortcode of this plugin) and get the id of the fixed page in the <body> tag. Here, let's assume page_id=7777.

(3) Copy and paste the following content at the bottom of the CSS.

#post-7777 #apcf_confirmation_btn { /* The position of the button displayed on the confirmation page (the submit button of the inquiry form) will be left aligned */
margin-left: 0 !important;
padding-left: 0 !important;
text-align: left !important;
display: relative !important;
}
#post-7777 #apcf_confirmation_btn .btn_confirm {
text-align: left !important;
border: #000;
background: #000;
display: absolute;
top: 15px; /* Sets the spacing between the confirmation-table and the button */
left: 0;
}

(3) Save the CSS, upload it to the server, and overwrite the existing file.

That's all!

( 2023/February/13, 02:30:12, JST )

Give me the CSS for the "submit button". I'd like to change the position of the "submit button" for each Wordpress Page. For each Page (each contact-form), I'd like to show the button at "center-aligned" or "left-aligned".

Search the FAQ DataBase