ABCDEF
1
MTPC Presset Classes
(last revison 22/06/2022)
2
3
4
Class NameUsage LevelDescription (What's the class can do)Remarks
5
Page Layouts & Alignment Tweaks
6
page-title-leftbodysectionblockThis class aligns the page title to the left.
7
page-title-centerbodysectionblockThis class aligns the page title to the center.
8
page-title-rightbodysectionblockThis class aligns the page title to the right.
9
layout-fixedbodysectionblockThis class sets the entire page layout to a fixed width of 1280px. works for individual pages
10
layout-fullbodysectionblockThis class sets the page layout to a full 100% width. works for individual pages
11
no-footer-marginbodysectionblockThis class removes the margin between the page footer and the last section.
12
align-centerbodysectionblockThis class aligns the elements to the center.
13
align-leftbodysectionblockThis class aligns the elements to the left.
14
align-rightbodysectionblockThis class aligns the elements to the right.
15
Block Tweaks
16
mtpc-hide-desktopbodysectionblockThis class hides the block/section in desktop view
17
mtpc-hide-tabletbodysectionblockThis class hides the block/section in tablet view
18
mtpc-hide-mobilebodysectionblockThis class hides the block/section in mobile view
19
block-border-leftbodysectionblockThis class creates a border at the left of the block.desktop & tablet border set to left side
mobile boder set to top
20
block-border-rightbodysectionblockThis class creates a border at the right of the block.desktop & tablet border set to right side
mobile boder set to bottom
21
block-top-20bodysectionblockThis class set a 20px padding to the top of the block.
22
no-overflowbodysectionblockThis class reset the overflow to unset
23
no-marginbodysectionblockThis class removes the default margins (if exists).
24
mtpc-wellbodysectionblockThis class adds a rounded border around an element with a gray background color and some padding
25
well-darkbodysectionblockThis class is an option for the mtpc-well class, it darkens the background and the borderYou must use mtpc-well class first before use this class
26
section-darkbodysectionblockThis class set the color of the elments (p, li, and image caption) to white color
27
no-paddingbodysectionblockThis class removes the default paddings (if exists).
28
space-top-0bodysectionblockThis class removes all the top spacing of the block./section
29
space-top-5bodysectionblockThis class set a 5px padding to the top of the block/section.
30
space-top-10bodysectionblockThis class set a 10px padding to the top of the block/section.
31
space-top-15bodysectionblockThis class set a 15px padding to the top of the block/section.
32
space-top-20bodysectionblockThis class set a 20px padding to the top of the block/section.
33
space-top-30bodysectionblockThis class set a 30px padding to the top of the block/section.
34
space-top-40bodysectionblockThis class set a 40px padding to the top of the block/section.
35
space-top-50bodysectionblockThis class set a 50px padding to the top of the block/section.
36
space-bottom-0bodysectionblockThis class removes all the bottom spacing of the block./section
37
space-bottom-5bodysectionblockThis class set a 5px padding to the bottom of the block/section.
38
space-bottom-10bodysectionblockThis class set a 10px padding to the bottom of the block/section.
39
space-bottom-15bodysectionblockThis class set a 15px padding to the bottom of the block/section.
40
space-bottom-20bodysectionblockThis class set a 20px padding to the bottom of the block/section.
41
space-bottom-30bodysectionblockThis class set a 30px padding to the bottom of the block/section.
42
space-bottom-40bodysectionblockThis class set a 40px padding to the bottom of the block/section.
43
space-bottom-50bodysectionblockThis class set a 50px padding to the bottom of the block/section.
44
2 Column Layout Tweaks
45
l25_75bodysectionblockThis class sets the left and right columns to 25% and 75%, respectively.2 columns section only
46
l75_25bodysectionblockThis class sets the left and right columns to 75% and 25%, respectively.
47
l30_70bodysectionblockThis class sets the left and right columns to 30% and 70%, respectively.
48
l70_30bodysectionblockThis class sets the left and right columns to 70% and 30%, respectively.
49
l35_65bodysectionblockThis class sets the left and right columns to 35% and 65%, respectively.
50
l65_35bodysectionblockThis class sets the left and right columns to 65% and 35%, respectively.
51
l40_60bodysectionblockThis class sets the left and right columns to 40% and 60%, respectively.
52
l60_40bodysectionblockThis class sets the left and right columns to 60% and 40%, respectively.
53
l45_55bodysectionblockThis class sets the left and right columns to 45% and 55%, respectively.
54
l55_45bodysectionblockThis class sets the left and right columns to 55% and 45%, respectively.
55
sidebar_leftbodysectionblockThis class fixes the sidemenu width and position if side menu is in left side.Default width is 300px
56
sidebar_rightbodysectionblockThis class fixes the sidemenu width and position if side menu is in right side.
57
sidebar_left_250bodysectionblockThis class fixes the sidemenu width and position if side menu is in right side.Default width is 250px
58
sidebar_right_250bodysectionblockThis class fixes the sidemenu width and position if side menu is in right side.
59
bottom-linebodysectionblockThis class adds a line at the bottom of the section with no margin between the image and the gray line*. 2 columns section only
*. Image has to be on the left container
( if you need to put the image on right side,
you can simply use reverse row option)
60
valign-middlebodysectionblockThis class vertically align the content of (left side/right side) to the middle of the section containerdefault is (Top)
61
valign-bottombodysectionblockThis class vertically align the content of (left side/right side) to the bottom of the section containerdefault is (Top)
62
Background Image Tweaks
63
bg-attachment-fixedbodysectionblockThe background image is fixed and does not scroll with the rest of the page.
64
bg-repeatbodysectionblockThe background image is repeated both vertically and horizontally.
65
bg-repeat-xbodysectionblockThe background image is repeated horizontally only.
66
bg-repeat-ybodysectionblockThe background image is repeated vertically only.
67
bg-no-repeatbodysectionblockThe background image is not repeated.
68
bg-size-coverbodysectionblockThis class resizes the background image to cover the entire section.
69
bg-size-containbodysectionblockThis class resizes the background image to ensure that it is fully visible.
70
bg-position-x-leftbodysectionblockThe background image is set horizontally to the left.
71
bg-position-x-rightbodysectionblockThis class sets the background image horizontally to the right.
72
bg-position-x-centerbodysectionblockThis class sets the background image horizontally to the center.
73
bg-position-y-topbodysectionblockThis class sets the background image vertically to the top.
74
bg-position-y-centerbodysectionblockThis class sets the background image vertically to the center.
75
bg-position-y-bottombodysectionblockThis class sets the background image vertically to the bottom.
76
body-bg-position-y-bottombodysectionblockThis class sets the body background image vertically to the bottom.Do NOT use with section classes
77
Navigation Menu
78
sub-r-positionbodysectionblockSet the position of a sub menu to right positionDefault is left Except last item (always right)
79
sub-large-widthbodysectionblockset the width of a sub menu to 300pxDefault is 205px
80
sub-xlarge-widthbodysectionblockset the width of a sub menu to 450pxDefault is 205px
81
sub-full-widthbodysectionblockset the width of a sub menu to full width (item text will be set to nowrap)Default is 205px
82
Tables
83
tbl-scrollbodysectionblockThis class enables the horizontal scroll to any tableadd it as additional class
e.g. tbl-bg tbl-scroll
84
Specific Blocks
85
Slideshow block
86
text-bg-shadowblockThis class show a drop shadow behind the slide show texts
87
88
89