Home v1 via Gutenberg

Home v1 of Vodi is built using Gutenberg.It has 10 blocks.

The Details

1. Movies Slider

Settings

Field Type Description Default
Search Post Text Search the movie by id or name. None
Pick an Background Image Media Upload slider background image None
Pick an image Media Upload slider thumbnail image None
Style Selection You can select style version Style-v1
Gallery Title Text Enter gallery title Todays Recomendation
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

2. Movies Section Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter the section title Popular Movies to Watch Now
Section Subtitle Text Enter the section subtitle Most watched movies by days
Action Text Text Enter the Action Text view all
Action Link Text Enter the Action Link. #
Background Color Selection You can select Dark and light BG Default
Style Selection You can select style version Style-v1
Movies Attributes Panel Body Select the movie attributes from the below options
Limit Range Control Drag the slider to set the total number of movies to be displayed 5
Columns Range Control Drag the slider to set the number of columns to be displayed 5
Order By Select Control Choose the order of your movies, either by Title, Date, Id. Date
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. DESC
Search Post Text Search the movie by id or name None
Search Term Text Search the movie by category slug None
Featured Checkbox Check to show featured movies. None
Top Rated Checkbox Check to show Top Rated movies. None
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

3. Movies Carousel Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter Section title Romantic for Valentines Day
Section Sub Title Text Enter Section sub title
Action Text Text Enter action text you can add more action text View All
Action Link Text Enter action URL you can add more action URL #
Header Position Selection You can select Left and Right header alignment Right
Background Color Selection You can select Dark and light BG Default
Style Selection You can select style version Style-v1
Movies Attributes Panel Body Select the movies attributes from the below options
Limit Range Control Enter the number of products to displayed 8
Order by Text Defaults to ‘Date’. One or more options can be passed Date
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. DESC
Search Post Text Enter the name of the movie name and select to show. None
Search Term Text Enter the name of the category name and select to show. None
Featured Checkbox Check to show featured posts. None
Top Rated Checkbox Check to show Top Rated. None
Carousel Args Panel Body Select the movie attributes none
Slide To Show Range Control Drag the slider to set the total number of movies to be displayed None
Slides To Scroll Range Control Drag the slider to set the number of movies to be scrolled None
Arrow Checkbox Check to show carousel arrows. None
Infinite Scroll Checkbox Check to infinite scroll carousel. Random
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

4. Featured Movie

Settings

Field Type Description Default
Search Post Text Enter the name of the movie name and select to show. None
Feature Movie Action Icon Text Enter the feature movie action icon class. None
Pick an image Media Upload the image None
Pick an background image Media Upload background image None
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

5. Movies Carousel Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter Section title Action & Drama Movies
Section Sub Title Text Enter Section sub title none
Action Text Text Enter action text you can add more action text View All
Action Link Text Enter action URL and you can add more action URL #
Header Position Selection You can select Left and Right header alignment right
Background Color Selection You can select Dark and light BG Default
Style Selection You can select style version Style-v1
Movies Attributes Panel Body Select the movies attributes from the below options
Limit Range Control Enter the number of products to displayed 8
Order by Text Defaults to ‘Date’. One or more options can be passed Date
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. DESC
Search Post Text Enter the name of the movie name and select to show. None
Search Term Text Enter the name of the category name and select to show. None
Featured Checkbox Check to show featured posts. None
Top Rated Checkbox Check to show Top Rated. None
Carousel Args Panel Body Select the movie attributes none
Slide To Show Range Control Drag the slider to set the total number of movies to be displayed None
Slides To Scroll Range Control Drag the slider to set the number of movies to be scrolled None
Arrow Checkbox Check to show carousel arrows. None
Infinite Scroll Checkbox Check to infinite scroll carousel. Random
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

6. Movies Carousel Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter Section title Funniest Comedy Movies of 2018
Section Sub Title Text Enter Section sub title
Action Text Text Enter action text you can add more action text View All
Action Link Text Enter action URL you can add more action URL #
Header Position Selection You can select Left and Right header alignment Left
Background Color Selection You can select Dark and light BG Default
Style Selection You can select style version Style-v1
Movies Attributes Panel Body Select the movies attributes from the below options
Limit Range Control Enter the number of products to displayed 8
Order by Text Defaults to ‘Date’. One or more options can be passed Date
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. DESC
Search Post Text Enter the name of the movie name and select to show. None
Search Term Text Enter the name of the category name and select to show. None
Featured Checkbox Check to show featured posts. None
Top Rated Checkbox Check to show Top Rated. None
Carousel Args Panel Body Select the movie attributes none
Slide To Show Range Control Drag the slider to set the total number of movies to be displayed None
Slides To Scroll Range Control Drag the slider to set the number of movies to be scrolled None
Arrow Checkbox Check to show carousel arrows. None
Infinite Scroll Checkbox Check to infinite scroll carousel. Random
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

7. Featured TV Show

Settings

Field Type Description Default
Search Post Text Enter the name of the movie name and select to show. None
pick Background image media Upload background image none
Is Light Background Checkbox Enable to set background as light none
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

8. TV Shows Section Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter the section title Popular TV Series Right Now
Section Subtitle Text Enter the section subtitle none
Action Text Text Enter the Action Text none
Action Link Text Enter the Action Link. none
Background Color Selection You can select Dark and light BG Default
Style Selection You can select style version Style-v1
TV Shows Attributes Panel Body Select the tv show attributes from the below options
Limit Range Control Drag the slider to set the total number of tv shows to be displayed 10
Order By Select Control Choose the order of your tv shows, either by Title, Date, Id. Date
Order Select Control Choose the order of your tv shows to be displayed either in Ascending or Descending Order. DESC
Search Post Text Search the tv show by id or name None
Search Term Text Search the tv show by category slug None
Featured Checkbox Check to show featured tv shows. None
Top Rated Checkbox Check to show Top Rated tv shows. None
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

9. TV Episodes Carousel Aside Header Block

Settings

Field Type Description Default
Section Title Text Enter the section title Featured TV Episode Premieres
Section Subtitle Text Enter the section subtitle none
Action Text Text Enter the Action Text none
Action Link Text Enter the Action Link. none
Header Position Selection You can select Left and Right header alignment Right
Background Color Selection You can select Dark and light BG Default
Episodes Attributes Panel Body Select the episode attributes from the below options
Limit Range Control Drag the slider to set the total number of episodes to be displayed 6
Order By Select Control Choose the order of your episodes, either by Title, Date, Id. Date
Order Select Control Choose the order of your episodes to be displayed either in Ascending or Descending Order. DESC
Search Post Text Search the episode by id or name None
Search Term Text Search the episode by category slug None
Featured Checkbox Check to show featured episodes. None
Top Rated Checkbox Check to show Top Rated episodes. None
Carousel Args Panel Body Select the episode attributes none
Slide To Show Range Control Drag the slider to set the total number of episodes to be displayed None
Slides To Scroll Range Control Drag the slider to set the number of episodes to be scrolled None
Arrow Checkbox Check to show carousel arrows. None
Infinite Scroll Checkbox Check to infinite scroll carousel. Random
Design Options Panel Body Adjust the block by margin and padding values None
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output

10. Movies List

Settings

Field Type Description Default
Section Title Text Enter section title TOP 9 this Week
Action Text Text Enter the Action Text. Movies
Action Link Text Enter the Action Link. #
Plus Button Click plus to add more action text and action link. None
Minus Button Click minus to remove action text and action link. None
Movies List Attributes 1 Panel Body Select the movie attributes from the below options
Limit Range Control Drag the slider to set the total number of movies to be displayed 9
Columns Range Control Drag the slider to set the number of columns to be displayed 1
Order By Select Control Choose the order of your movies, either by Title, Date, Id. Random
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. ASC
Search Post Text Search the video by id or name None
Search Term Text Search the video by category slug None
Featured Checkbox Check to show featured videos. None
Top Rated Checkbox Check to show Top Rated videos. None
Featured Movie with Movies List Panel Body Choose the Featured movie id and movie attributes none
Section Title Text Enter section title Newest Movies
Action Text Text Enter the Action Text. Today
Action Link Text Enter the Action Link. #
Plus Button Click plus to add more action text and action link. None
Minus Button Click minus to remove action text and action link. None
Search Post Text Enter the featured movie The Leisure Seeker
Movies List Attributes 2 Panel Body Select the movie attributes from the below options
Limit Range Control Drag the slider to set the total number of movies to be displayed 8
Columns Range Control Drag the slider to set the number of columns to be displayed 1
Order By Select Control Choose the order of your movies, either by Title, Date, Id. Random
Order Select Control Choose the order of your movies to be displayed either in Ascending or Descending Order. ASC
Search Post Text Search the video by id or name None
Search Term Text Search the video by category slug None
Featured Checkbox Check to show featured videos. None
Top Rated Checkbox Check to show Top Rated videos. None
Design Options Panel Body Choose the design options none
Padding Top Range Control Enter number pixel to add padding top. None
Padding Bottom Range Control Enter number pixel to add padding bottom. None
Design Options Panel Body Adjust the block by margin and padding values None
Padding Left Range Control Enter number pixel to add padding left. None
Padding Right Range Control Enter number pixel to add padding right. None
Margin Top Range Control Enter number pixel to add margin top. None
Margin Bottom Range Control Enter number pixel to add margin bottom. None
Margin Left Range Control Enter number pixel to add margin left. None
Margin Right Range Control Enter number pixel to add margin right. None
Additional CSS Class Text Enter additional class name. None

Output