Det här tillägget har inte testats med någon av de 3 senaste huvudversionerna av WordPress. Det kanske inte längre underhålls och kan ha kompatibilitetsproblem när det används tillsammans med nyare versioner av WordPress.

Ninja Forms Blocks

Beskrivning

Ninja Forms Blocks is really simple plugin adding two form elements: [BLOCK] and [/BLOCK].
[BLOCK] is a html div element with custom class option. Using blocks you can:

  • Separate your form elements by logic
  • If you use some bootstrap like framework create columns using classes .col.col-6
  • Create or apply your CSS to form elements groups

Skärmdumpar

  • Add open [BLOCK] and close [/BLOCK] to your Ninja Form
  • Add custom class to [BLOCK]

Installation

  1. Upload njf_blocks folder to the /wp-content/plugins/ directory
  2. Activate the plugin through the ’Plugins’ menu in WordPress
  3. add open [BLOCK] and close [/BLOCK] to your Ninja Form
  4. add css code for your blocks

Vanliga frågor

How I can create two columns layout with custom css?

Create two columns with blocks in form editor, add
njf-column njf-column__left
classes to first [BLOCK] and
njf-column njf-column__right
classes to second [BLOCK].
Then add this code to your CSS file (thanks @ronherren):
.njf-column {
display: -moz-inline-stack; /* Firefox inline-block fix /
display: inline-block;
vertical-align: top; /
Align both columns to top /
zoom: 1; /
IE inline-block fix /
*display: inline; /
IE inline-block fix */
width: 49.5%;
}

Recensioner

8 januari, 2018
My client built all their Ninja forms using this, and now I cannot use the latest Ninja Form, because this add-on does not support it. Author promised to fix it 2 years ago, but nothing has been done.
3 september, 2016
Exactly was I was looking for. I really like to use the css classes built into my theme, Ninja Forms Blocks makes that possible. Now, @Alexander Chernovm, do you plan to test this fine plugin with WordPress 4.5 and Ninja Forms 3 once that arrives?
3 september, 2016
usefull plugin for ninja form thank you, it create perfectly 2 column. By the is there possible to create 3 column / 4column?
3 september, 2016
Until I found the following CSS fixes I would've rated lower, but the simplicity of your solution Alexander is remarkable. Excellent plugin! May I suggest you add the following to your default CSS instructions & FAQ? /* Ninja Forms Blocks - adds 2 columns to forms */ .njf-column { display: -moz-inline-stack; /* Firefox inline-block fix */ display: inline-block; vertical-align: top; /* Align both columns to top */ width: 49.5%; } Also, here is a fix for IE6/7, which I didn't test. Add to above section: zoom: 1; *display: inline; Props to Ryan Doherty of Mozilla.com for this detailed explanation of cross-browser support for inline-block, which also includes an additional fix for IE6 min-height.
Läs alla 8 betyg

Bidragsgivare och utvecklare

”Ninja Forms Blocks” är programvara med öppen källkod. Följande personer har bidragit till detta tillägg.

Bidragande personer

Översätt ”Ninja Forms Blocks” till ditt språk.

Intresserad av programutveckling?

Läs programkoden, kika på SVN-filförvaret eller prenumerera på utvecklarloggen via RSS.

Ändringslogg

1.2

  • Blocks removed from places not realated to form layout

1.1

  • Blocks moved to layout section

1.0

  • Blocks functionality