Process Steps - Security Design
1931
page-template-default,page,page-id-1931,page-child,parent-pageid-121,theme-bridge,woocommerce-no-js,ajax_fade,page_not_loaded,,columns-4,qode-theme-ver-16.7,qode-theme-bridge,wpb-js-composer js-comp-ver-4.12,vc_responsive
 

Process Steps

Process Steps

[tabs]
[tab title=”Parameters” icon=”check” icon_color=”#3cabce”]

Parameters

[divider_line]
[list icon=”check” color=”blue”]

  • size:small,default,large
  • number of steps:2,3,4,5
  • type:horizontal,vertical
  • per step : Title, Icon, Icon Color & Content
  • title(optional)
  • icon:(optional)
  • iconcolor(optional)
  • content:(optional)

[/list]
[/tab]
[tab title=”Shortcode Option Panel” icon=”check” icon_color=”#3cabce”]

Shortcode Option Panel

[divider_line]
[image source_type=”attachment_id” source_value=”3233″ caption=”The Process Steps Shortcode Options Panel” alt=”The Process Steps Shortcode Options Panel” align=”center” icon=”zoom” width=”594″ autoHeight=”true” quality=”100″ lightbox=”true” title=”The Process Steps Shortcode Options Panel”]
[/tab]
[/tabs]

[divider_padding]

3 Process Steps with Small Size

[divider_line]
[process_steps type=”horizontal” size=”small” number=”3″]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality.
[/process_step]
[process_step title=”Development” icon=”desktop”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s).
[/process_step]
[/process_steps]
[toggle title=”Get the code”]
[code]
[process_steps type=”horizontal” size=”small” number=”3″]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality.
[/process_step]
[process_step title=”Development” icon=”desktop”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s).
[/process_step]
[/process_steps]
[/code]
[/toggle]

[divider_padding]

Process Steps with Medium Size & Custom Icon Color

[divider_line]
[process_steps type=”horizontal” size=”default”]
[process_step title=”Planning” icon=”list-ol” icon_color=”#27ccc0″]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project.
[/process_step]
[process_step title=”Design” icon=”pencil” icon_color=”#2ac4ea”]
The design stage typically involves moving the information outlined in the planning stage further into reality.
[/process_step]
[process_step title=”Development” icon=”desktop” icon_color=”#f6653c”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s).
[/process_step]
[/process_steps]
[toggle title=”Get the code”]
[code][process_steps type=”horizontal” size=”default”]
[process_step title=”Planning” icon=”list-ol” icon_color=”#27ccc0″]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project.
[/process_step]
[process_step title=”Design” icon=”pencil” icon_color=”#2ac4ea”]
The design stage typically involves moving the information outlined in the planning stage further into reality.
[/process_step]
[process_step title=”Development” icon=”desktop” icon_color=”#f6653c”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s).
[/process_step]
[/process_steps][/code]
[/toggle]

[divider_padding]

2 Process Steps with Large Size

[divider_line]
[process_steps type=”horizontal” size=”large” number=”2″]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project. This is also the stage that requires client interaction and the accompanying attention to detail.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality. The main deliverables are a documented site structure and, more importantly, a visual representation.
[/process_step]
[/process_steps]
[toggle title=”Get the code”]
[code][process_steps type=”horizontal” size=”large” number=”2″]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project. This is also the stage that requires client interaction and the accompanying attention to detail.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality. The main deliverables are a documented site structure and, more importantly, a visual representation.
[/process_step]
[/process_steps][/code]
[/toggle]

[divider_padding]

Process Steps with Vertical

[divider_line]
[process_steps type=”vertical” size=”default”]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project. This is also the stage that requires client interaction and the accompanying attention to detail.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality. The main deliverables are a documented site structure and, more importantly, a visual representation.
[/process_step]
[process_step title=”Development” icon=”desktop”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s). Keep code organized and commented, and refer constantly to the planning details as the full website takes shape.
[/process_step]
[/process_steps]
[toggle title=”Get the code”]
[code][process_steps type=”vertical” size=”large”]
[process_step title=”Planning” icon=”list-ol”]
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project. This is also the stage that requires client interaction and the accompanying attention to detail.
[/process_step]
[process_step title=”Design” icon=”pencil”]
The design stage typically involves moving the information outlined in the planning stage further into reality. The main deliverables are a documented site structure and, more importantly, a visual representation.
[/process_step]
[process_step title=”Development” icon=”desktop”]
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s). Keep code organized and commented, and refer constantly to the planning details as the full website takes shape.
[/process_step]
[/process_steps][/code]
[/toggle]

[divider_top]