Homepage design updates
This commit is contained in:
Garrett Moon
parent
cd1f252102
commit
6aafb9e6da
|
|
@ -6286,7 +6286,164 @@ pre {
|
|||
padding: 0;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Body & Page Structure
|
||||
Homepage
|
||||
============================================================================================== */
|
||||
.homepage-hero {
|
||||
padding-top: 50px !important;
|
||||
background-color: #82becd;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
color: #3f4657;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-hero {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
}
|
||||
.homepage-hero .text-center {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
.homepage-hero h2 {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.homepage-hero .homepage-image {
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.hero-buttons.container-fluid {
|
||||
padding: 20px 0px;
|
||||
background-color: #c5c5cb;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
padding: 20px 30px;
|
||||
background-image: none;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
text-shadow: none;
|
||||
border: none;
|
||||
-moz-opacity: 0.8;
|
||||
-khtml-opacity: 0.8;
|
||||
-webkit-opacity: 0.8;
|
||||
opacity: 0.8;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
|
||||
filter: alpha(opacity=80);
|
||||
margin: 0px 10px;
|
||||
text-transform: uppercase;
|
||||
border: 5px solid #3f4657;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn:hover {
|
||||
-moz-opacity: 1;
|
||||
-khtml-opacity: 1;
|
||||
-webkit-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-secondary {
|
||||
background-color: #c5c5cb;
|
||||
color: #3f4657;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-primary {
|
||||
background-color: #3f4657;
|
||||
color: #f7f7f7;
|
||||
}
|
||||
.homepage-content.container-fluid {
|
||||
background-color: white;
|
||||
padding: 40px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid .lead {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
.homepage-content.container-fluid ul,
|
||||
.homepage-content.container-fluid ol {
|
||||
padding: 20px 0px;
|
||||
margin: 0 0 10px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li,
|
||||
.homepage-content.container-fluid ol li {
|
||||
list-style: none;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li:before,
|
||||
.homepage-content.container-fluid ol li:before {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid #82becd;
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 6px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-content.container-fluid {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid {
|
||||
background-color: #3f4657;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
color: light;
|
||||
border: none;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-footer.container-fluid {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav {
|
||||
margin: 40px 0px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li {
|
||||
list-style: none;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a:hover {
|
||||
color: #82becd;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter:first-child {
|
||||
margin-top: 40px;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Docs Body & Page Structure
|
||||
============================================================================================== */
|
||||
html,
|
||||
body {
|
||||
|
|
@ -6298,12 +6455,14 @@ body {
|
|||
}
|
||||
.container-fluid {
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container-fluid.fluid-height {
|
||||
height: 100%;
|
||||
}
|
||||
.columns {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6286,7 +6286,164 @@ pre {
|
|||
padding: 0;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Body & Page Structure
|
||||
Homepage
|
||||
============================================================================================== */
|
||||
.homepage-hero {
|
||||
padding-top: 50px !important;
|
||||
background-color: #8acc37;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-hero {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
}
|
||||
.homepage-hero .text-center {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
.homepage-hero h2 {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.homepage-hero .homepage-image {
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.hero-buttons.container-fluid {
|
||||
padding: 20px 0px;
|
||||
background-color: #a0d55d;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
padding: 20px 30px;
|
||||
background-image: none;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
text-shadow: none;
|
||||
border: none;
|
||||
-moz-opacity: 0.8;
|
||||
-khtml-opacity: 0.8;
|
||||
-webkit-opacity: 0.8;
|
||||
opacity: 0.8;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
|
||||
filter: alpha(opacity=80);
|
||||
margin: 0px 10px;
|
||||
text-transform: uppercase;
|
||||
border: 5px solid #000000;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn:hover {
|
||||
-moz-opacity: 1;
|
||||
-khtml-opacity: 1;
|
||||
-webkit-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-secondary {
|
||||
background-color: #a0d55d;
|
||||
color: #000000;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-primary {
|
||||
background-color: #000000;
|
||||
color: #f5f5f6;
|
||||
}
|
||||
.homepage-content.container-fluid {
|
||||
background-color: white;
|
||||
padding: 40px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid .lead {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
.homepage-content.container-fluid ul,
|
||||
.homepage-content.container-fluid ol {
|
||||
padding: 20px 0px;
|
||||
margin: 0 0 10px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li,
|
||||
.homepage-content.container-fluid ol li {
|
||||
list-style: none;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li:before,
|
||||
.homepage-content.container-fluid ol li:before {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid #8acc37;
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 6px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-content.container-fluid {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid {
|
||||
background-color: #000000;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
color: light;
|
||||
border: none;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-footer.container-fluid {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav {
|
||||
margin: 40px 0px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li {
|
||||
list-style: none;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a:hover {
|
||||
color: #8acc37;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter:first-child {
|
||||
margin-top: 40px;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Docs Body & Page Structure
|
||||
============================================================================================== */
|
||||
html,
|
||||
body {
|
||||
|
|
@ -6298,12 +6455,14 @@ body {
|
|||
}
|
||||
.container-fluid {
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container-fluid.fluid-height {
|
||||
height: 100%;
|
||||
}
|
||||
.columns {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6286,7 +6286,164 @@ pre {
|
|||
padding: 0;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Body & Page Structure
|
||||
Homepage
|
||||
============================================================================================== */
|
||||
.homepage-hero {
|
||||
padding-top: 50px !important;
|
||||
background-color: #7795b4;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
color: #13132a;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-hero {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
}
|
||||
.homepage-hero .text-center {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
.homepage-hero h2 {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.homepage-hero .homepage-image {
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.hero-buttons.container-fluid {
|
||||
padding: 20px 0px;
|
||||
background-color: #c5c5cb;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
padding: 20px 30px;
|
||||
background-image: none;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
text-shadow: none;
|
||||
border: none;
|
||||
-moz-opacity: 0.8;
|
||||
-khtml-opacity: 0.8;
|
||||
-webkit-opacity: 0.8;
|
||||
opacity: 0.8;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
|
||||
filter: alpha(opacity=80);
|
||||
margin: 0px 10px;
|
||||
text-transform: uppercase;
|
||||
border: 5px solid #13132a;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn:hover {
|
||||
-moz-opacity: 1;
|
||||
-khtml-opacity: 1;
|
||||
-webkit-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-secondary {
|
||||
background-color: #c5c5cb;
|
||||
color: #13132a;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-primary {
|
||||
background-color: #13132a;
|
||||
color: #f5f5f6;
|
||||
}
|
||||
.homepage-content.container-fluid {
|
||||
background-color: white;
|
||||
padding: 40px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid .lead {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
.homepage-content.container-fluid ul,
|
||||
.homepage-content.container-fluid ol {
|
||||
padding: 20px 0px;
|
||||
margin: 0 0 10px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li,
|
||||
.homepage-content.container-fluid ol li {
|
||||
list-style: none;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li:before,
|
||||
.homepage-content.container-fluid ol li:before {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid #7795b4;
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 6px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-content.container-fluid {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid {
|
||||
background-color: #13132a;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
color: light;
|
||||
border: none;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-footer.container-fluid {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav {
|
||||
margin: 40px 0px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li {
|
||||
list-style: none;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a:hover {
|
||||
color: #7795b4;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter:first-child {
|
||||
margin-top: 40px;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Docs Body & Page Structure
|
||||
============================================================================================== */
|
||||
html,
|
||||
body {
|
||||
|
|
@ -6298,12 +6455,14 @@ body {
|
|||
}
|
||||
.container-fluid {
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container-fluid.fluid-height {
|
||||
height: 100%;
|
||||
}
|
||||
.columns {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
|||
163
css/daux-red.css
163
css/daux-red.css
|
|
@ -6286,7 +6286,164 @@ pre {
|
|||
padding: 0;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Body & Page Structure
|
||||
Homepage
|
||||
============================================================================================== */
|
||||
.homepage-hero {
|
||||
padding-top: 50px !important;
|
||||
background-color: #ecb5a1;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
color: #c64641;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-hero {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
}
|
||||
.homepage-hero .text-center {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
.homepage-hero h2 {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.homepage-hero .homepage-image {
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.hero-buttons.container-fluid {
|
||||
padding: 20px 0px;
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
padding: 20px 30px;
|
||||
background-image: none;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
text-shadow: none;
|
||||
border: none;
|
||||
-moz-opacity: 0.8;
|
||||
-khtml-opacity: 0.8;
|
||||
-webkit-opacity: 0.8;
|
||||
opacity: 0.8;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
|
||||
filter: alpha(opacity=80);
|
||||
margin: 0px 10px;
|
||||
text-transform: uppercase;
|
||||
border: 5px solid #c64641;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.hero-buttons.container-fluid .btn-hero.btn {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn:hover {
|
||||
-moz-opacity: 1;
|
||||
-khtml-opacity: 1;
|
||||
-webkit-opacity: 1;
|
||||
opacity: 1;
|
||||
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-secondary {
|
||||
background-color: #eeeeee;
|
||||
color: #c64641;
|
||||
}
|
||||
.hero-buttons.container-fluid .btn-hero.btn.btn-primary {
|
||||
background-color: #c64641;
|
||||
color: #f7f7f7;
|
||||
}
|
||||
.homepage-content.container-fluid {
|
||||
background-color: white;
|
||||
padding: 40px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid .lead {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
.homepage-content.container-fluid ul,
|
||||
.homepage-content.container-fluid ol {
|
||||
padding: 20px 0px;
|
||||
margin: 0 0 10px 0px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li,
|
||||
.homepage-content.container-fluid ol li {
|
||||
list-style: none;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-content.container-fluid ul li:before,
|
||||
.homepage-content.container-fluid ol li:before {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid #ecb5a1;
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 6px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-content.container-fluid {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid {
|
||||
background-color: #c64641;
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-moz-border-radius: 0px;
|
||||
-webkit-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
color: light;
|
||||
border: none;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.homepage-footer.container-fluid {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav {
|
||||
margin: 40px 0px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li {
|
||||
list-style: none;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a {
|
||||
font-family: 'Roboto Slab', serif;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.homepage-footer.container-fluid .footer-nav li a:hover {
|
||||
color: #ecb5a1;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.homepage-footer.container-fluid .twitter:first-child {
|
||||
margin-top: 40px;
|
||||
}
|
||||
/* ===========================================================================================
|
||||
Docs Body & Page Structure
|
||||
============================================================================================== */
|
||||
html,
|
||||
body {
|
||||
|
|
@ -6298,12 +6455,14 @@ body {
|
|||
}
|
||||
.container-fluid {
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container-fluid.fluid-height {
|
||||
height: 100%;
|
||||
}
|
||||
.columns {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
All calls to the api must include a _token parameter to validate the call.
|
||||
|
||||
http://todaycms-api.herokuapp.com/?_token=XXXXXXXXXXXX
|
||||
|
||||
This guide will not include the _token in the sample calls. It is implied that it must be included.
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
The following collection config will be used as the config throughout the example calls in this guide.
|
||||
|
||||
{
|
||||
"team": {
|
||||
"title": "Team Members",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Name",
|
||||
"type": "text"
|
||||
},
|
||||
"employment": {
|
||||
"title": "Employment Status",
|
||||
"type": "select",
|
||||
"options": {
|
||||
"half": "Part Time",
|
||||
"full": "Full Time",
|
||||
"retired": "Retired"
|
||||
}
|
||||
},
|
||||
"bio": {
|
||||
"title": "Bio",
|
||||
"type": "textarea"
|
||||
},
|
||||
"address": {
|
||||
"title": "Home Address",
|
||||
"type": "location"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
To create an object in a collection, issue a HTTP POST call with the object in the body of the POST.
|
||||
|
||||
POST /collections/:collection
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
**Example**
|
||||
|
||||
POST /collections/team
|
||||
|
||||
name = Justin
|
||||
employment = full
|
||||
bio = Node.js developer
|
||||
address[city] = Bismarck
|
||||
address[state] = ND
|
||||
address[zip] = 58501
|
||||
...
|
||||
|
||||
Note: 'team' is the key used in our example config at the top of this guide
|
||||
|
||||
**Returns**
|
||||
|
||||
The object you just created.
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
To read from a collection, issue a HTTP GET call
|
||||
|
||||
GET /collections/:collection
|
||||
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
**Returns**
|
||||
|
||||
An array of objects from the collection.
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
To update an object in a collection, issue a HTTP POST call with the object in the body of the POST.
|
||||
|
||||
POST /collections/:collection/:id
|
||||
|
||||
name = Justin Walsh
|
||||
employment = part
|
||||
bio = Documention writer
|
||||
...
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
`:id` is the id of the object you want to update.
|
||||
|
||||
**Returns**
|
||||
|
||||
The object you just updated.
|
||||
|
|
@ -0,0 +1 @@
|
|||
Coming Soon
|
||||
|
|
@ -0,0 +1,152 @@
|
|||
To filter an api call, send the optional `filter` parameter. The filter parameter is a structured json object. Examples use the following terms:
|
||||
|
||||
* field key - Is the key used to define the field in the config.
|
||||
* operator - Is the comparison to preform.
|
||||
* value - Is what we will compare the object value to.
|
||||
|
||||
## Basic Structure
|
||||
|
||||
This is the most basic filter that can be preformed.
|
||||
|
||||
{
|
||||
"field key": "value"
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"employment":"full"}
|
||||
|
||||
This will find all full time team members in the collection.
|
||||
|
||||
## Advanced Structure
|
||||
|
||||
This structure allows more advanced control over operators used when filtering.
|
||||
|
||||
{
|
||||
"field key": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"employment": {"!=": "retired"}}
|
||||
|
||||
This will find all team members who are not retired in the collection.
|
||||
|
||||
## Multiple Operators Structure
|
||||
|
||||
You can preform multiple comparision operations on the same field
|
||||
|
||||
{
|
||||
"field key": {
|
||||
"operator": "value",
|
||||
"operator2": "value2",
|
||||
"operatorx..": "valuex.."
|
||||
}
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}
|
||||
|
||||
This will find all team members who's names start with 'Justin' but are not 'Justin Walsh'.
|
||||
|
||||
## Multiple Fields Structure
|
||||
|
||||
You can filter multiple fields by adding each field key to the object.
|
||||
|
||||
{
|
||||
"field key 1": "value",
|
||||
"field key 2": {
|
||||
"operator": "value"
|
||||
},
|
||||
"field key 3": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
|
||||
## Multiple Values Structure
|
||||
|
||||
When filtering, you can use an array instead of a string to match any of the values in the array.
|
||||
|
||||
{
|
||||
"employment": ["full", "part"],
|
||||
"name": {
|
||||
"LIKE": ["Justin%", "Brian%"]
|
||||
}
|
||||
}
|
||||
|
||||
This will match all team members who are full or part time, and whose names starts with 'Justin' or 'Brian'.
|
||||
|
||||
Note: `"employment": ["full", "part"]` is equvalient to
|
||||
|
||||
"employment": {
|
||||
"=": ["full", "part"]
|
||||
}
|
||||
|
||||
## Nested Fields Structure
|
||||
|
||||
You can filter by nested fields in the object using a dot notation syntax as the field key in the filter. This syntax can be used to query deep into nested objects and arrays, including fields like the 'multi'.
|
||||
|
||||
{
|
||||
"address.zip": "58501"
|
||||
}
|
||||
|
||||
This will filter the location field type by zip code, which is a nested field. This example is based on the sample config at the top of this guide.
|
||||
|
||||
## AND/OR Fields Structure (Not Supported Yet)
|
||||
|
||||
This structure allows a very customized query including both `-and` and `-or` statments.
|
||||
|
||||
{
|
||||
"field key 3": {
|
||||
"operator": "value"
|
||||
},
|
||||
"-or": {
|
||||
"field key 1": "value",
|
||||
"-and": {
|
||||
"field key 2": {
|
||||
"operator": "value"
|
||||
},
|
||||
"field key 4": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
## Supported Operators
|
||||
|
||||
| Operator | Description |
|
||||
| :--- | :--- |
|
||||
| = | equal to |
|
||||
| != | not equal to |
|
||||
| > | greater than |
|
||||
| < | less than |
|
||||
| >= | greater than or equal to |
|
||||
| <= | less than or equal to |
|
||||
| LIKE | case sensitive search, use '%' for wildcard |
|
||||
| ILIKE | case insensitive search, use '%' for wildcard |
|
||||
| NOT LIKE | inverse of 'LIKE' |
|
||||
| NOT ILIKE | inverse of 'ILIKE' |
|
||||
|
||||
|
||||
## Notes
|
||||
|
||||
**JSON Filtering**
|
||||
|
||||
The JSON object used for the `filter` parameter must be url encoded when calling the api. Here are examples of how to url encode a json object or string in different languages.
|
||||
|
||||
***php***
|
||||
|
||||
$escaped_json = urlencode('{"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}');
|
||||
|
||||
***javascript string***
|
||||
|
||||
var escaped_json_from_string = escape('{"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}');
|
||||
|
||||
***javascript object***
|
||||
|
||||
var escaped_json_from_object = escape(JSON.stringify({"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}));
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
A config object that contains other objects (admin sections) and displays them in a group.
|
||||
|
||||
Parent elements are characterized by a subhead in the admin panel navigation. They also group elements in the [[Outline (call)]].
|
||||
|
||||
{
|
||||
"sample_parent": {
|
||||
"title": "Sample Parent",
|
||||
"type": "parent"
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the object. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | parent | Object identifier. Required, must be set to: 'parent' |
|
||||
|
||||
### Single
|
||||
The Single object is created in the config.json file. This will create a single page that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"single-name": {
|
||||
"title": "single-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "single",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the page. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | single | Object identifier. Required, must be set to: 'single.' |
|
||||
| parent | - | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | Allows you to hide or show object elements in the admin panel. |
|
||||
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
The Single object is created in the config.json file. This will create a single page that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"single-name": {
|
||||
"title": "single-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "single",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
### Parameters
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the page. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | single | Object identifier. Required, must be set to: 'single.' |
|
||||
| parent | - | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | Allows you to hide or show object elements in the admin panel. |
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
The Multiple object is created in the 'config.json' file. This will create a group of many pages (records) that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"multiple-name": {
|
||||
"title": "multiple-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| :------------- | :------------- | :------------- | :------------- |
|
||||
| title | required | | Descriptive title of the object. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | multiple | | Object identifier. Required, must be set to: 'multiple.' |
|
||||
| parent | '' | | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | true,false | Allows you to hide or show object elements in the admin panel. |
|
||||
| filters | '' | | Creates a select menu in the admin panel that will filter returned records. |
|
||||
| sort | '' | asc, desc | Sorts records on call. |
|
||||
| display | '' | | Defines values to display in the admin output table for each record. |
|
||||
| download | true | true,false | Enables raw data download from admin panel. (csv file) |
|
||||
| redirects | true | true,false | Enables option to create link (url) based records. |
|
||||
| publish | true | true,false | Removes ability to save individual record as draft. |
|
||||
|
||||
## Filters Example
|
||||
|
||||
{
|
||||
"filters": ["value"]
|
||||
}
|
||||
|
||||
## Sort Example
|
||||
{
|
||||
"sort":{
|
||||
"value":"asc"
|
||||
}
|
||||
}
|
||||
|
||||
## Display Example
|
||||
{
|
||||
"display":["fname", "lname", "phone", "email"]
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a color picker field that will return a hex value through the API.
|
||||
|
||||
|
||||
|
||||
"color": {
|
||||
"title": "Color Picker",
|
||||
"type": "colorpicker"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a single date field with a visual calendar drop down.
|
||||
|
||||
|
||||
|
||||
"date": {
|
||||
"title": "Date Field",
|
||||
"type": "date"
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
Creates a single date and time field with a visual drop down for each.
|
||||
|
||||
|
||||
|
||||
"datetime": {
|
||||
"title": "Date Time Field",
|
||||
"type": "datetime"
|
||||
}
|
||||
|
||||
Returns a single date/time value.
|
||||
|
||||
[datetime] => 01/16/2012 12:00 am
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Creates a page divider with customizable text. Visible only from the CMS.
|
||||
|
||||
|
||||
|
||||
"divider-1": {
|
||||
"title": "Page Divider",
|
||||
"type": "divider"
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
Creates a single file upload field.
|
||||
|
||||
|
||||
|
||||
"file": {
|
||||
"title": "File Field",
|
||||
"type": "file"
|
||||
}
|
||||
|
||||
Returns an array.
|
||||
|
||||
[file] => Array
|
||||
(
|
||||
[caption] =>
|
||||
[date] => 11/1/2012
|
||||
[url] => http://todaycms.s3.amazonaws.com/...filename.pdf
|
||||
[name] => filename.pdf
|
||||
)
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
Creates multiple file upload fields with sort and caption options.
|
||||
|
||||
|
||||
|
||||
"files": {
|
||||
"title": "Files Field",
|
||||
"type": "files"
|
||||
}
|
||||
|
||||
Returns a multidimensional array.
|
||||
|
||||
[files] => Array
|
||||
(
|
||||
[0] => Array
|
||||
(
|
||||
[caption] => Pre-Order Form
|
||||
[date] => 2/13/2012
|
||||
[url] => http://todaycms.s3.amazonaws.com/...filename.pdf
|
||||
[name] => Author Visit - Beth McKinney.pdf
|
||||
)
|
||||
)
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
Creates an instance of the TodayCMS FormBuilder. This will allow end users to create complex forms with a variety of options for data collection and submission.
|
||||
|
||||
|
||||
|
||||
"form": {
|
||||
"title": "Form Builder",
|
||||
"type": "formbuilder"
|
||||
}
|
||||
|
||||
**Available Fields**
|
||||
|
||||
* Single Line Text
|
||||
* Multiple Line Text
|
||||
* Dropdown Select
|
||||
* Checkbox Options
|
||||
* Multiple Choice (Radio Buttons)
|
||||
* Phone
|
||||
* Email
|
||||
|
||||
**Form Actions**
|
||||
|
||||
* Redirect to another page
|
||||
* Display a message
|
||||
* Send to Paypal
|
||||
|
||||
**Returns**
|
||||
|
||||
See the [[Formbuilder (helper)]]
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
Creates a hidden form field.
|
||||
|
||||
"hidden": {
|
||||
"title": "Hidden Field",
|
||||
"type": "hidden",
|
||||
}
|
||||
|
||||
"hidden-forced-value": {
|
||||
"title": "Hidden Forced Value Field",
|
||||
"type": "hidden",
|
||||
"value": "Forced Value"
|
||||
}
|
||||
|
||||
"hidden-default-value": {
|
||||
"title": "Hidden Default Value Field",
|
||||
"type": "hidden",
|
||||
"default": "Default Value"
|
||||
}
|
||||
|
||||
"hidden-timestamp-value": {
|
||||
"title": "Hidden Timestamp Value Field",
|
||||
"type": "hidden",
|
||||
"default": "timestamp"
|
||||
}
|
||||
|
||||
"hidden-display-value": {
|
||||
"title": "Hidden Display Field",
|
||||
"type": "hidden",
|
||||
"value": "You should see this",
|
||||
"display": true
|
||||
}
|
||||
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| default | '' | string, timestamp | Sets a default value for the hidden field. Timestamp will display current date/time. |
|
||||
| display | false | true,false | Can see the value but can't change it |
|
||||
| auto_increment | false | true, false | Creates unique id starting with 1. |
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
Creates a single image upload field.
|
||||
|
||||
|
||||
|
||||
"image": {
|
||||
"title": "Image Field",
|
||||
"type": "image",
|
||||
"sizes": {
|
||||
"thumb": {
|
||||
"height": 150,
|
||||
"width": 150,
|
||||
"resize_strategy": "crop"
|
||||
},
|
||||
"large": {
|
||||
"height": 500,
|
||||
"width": 500,
|
||||
"resize_strategy": "fit"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Image fields allows you to determine multiple thumbnail/image sizes and cropping techniques.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| width | 1-5000 | Width of the input image | Width of the new image, in pixels |
|
||||
| height | 1-5000 | Height of the input image | Height of the new image, in pixels |
|
||||
| strip | boolean | false | Strips all metadata from the image. This is useful to keep thumbnails as small as possible. |
|
||||
| flatten | boolean | true | Flattens all layers onto the specified background to achive better results from transparent formats to non-transparent formats, as explained in the [ImageMagick](http://www.imagemagick.org/script/command-line-options.php?#layers) documentation. **Important:** To preserve animations, GIF files are not flattened when this is set to true. To flatten GIF animations, use the frame parameter. |
|
||||
| correct_gamma | boolean | false | Prevents gamma errors [common in many image scaling algorithms](http://www.4p8.com/eric.brasseur/gamma.html). |
|
||||
| quality | 1-100 | Quality of the input image, or 92 | Controls the image compression for JPG and PNG images. |
|
||||
| background | string | "#FFFFFF" | Either the hexadecimal code or [name](http://www.imagemagick.org/script/color.php#color_names) of the color used to fill the background (only used for the pad resize strategy). **Important:** By default, the background of transparent images is changed to white. For details about how to preserve transparency across all image types, see [this demo](https://transloadit.com/demos/image-resize/properly-preserve-transparency-across-all-image-types). |
|
||||
| resize_strategy | string | "fit" | See [[Resize Strategies Table]] |
|
||||
| zoom | boolean | true | If this is set to false, smaller images will not be stretched to the desired width and height. For details about the impact of zooming for your preferred resize strategy, see the [[Resize Strategies Table]]. |
|
||||
| crop | { x1: integer, y1: integer, x2: integer, y2: integer } | {} | Specify an object containing coordinates for the top left and bottom right corners of the rectangle to be cropped from the original image(s). For example, `{x1: 80, y1: 100, x2: 160, y2: 180}` will crop the area from `(80,100)` to `(160,180)` which is a square whose width and height are 80px. If crop is set, the width and height parameters are ignored, and the resize_strategy is set to crop automatically. |
|
||||
| format | string | Format of the input image | The available formats are `"jpg"`, `"png"`, `"gif"`, and `"tiff"`. |
|
||||
| gravity | string | center | The direction from which the image is to be cropped. The available options are `"center"`, `"top"`, `"bottom"`, `"left"`, and `"right"`. You can also combine options with a hyphen, such as `"bottom-right"`. |
|
||||
| frame | integer | null (all frames) | Use this parameter when dealing with animated GIF files to specify which frame of the GIF is used for the operation. Specify 1 to use the first frame, 2 to use the second, and so on. |
|
||||
| colorspace | string | " " | Sets the image colorspace. For details about the available values, see the [ImageMagick documentation](http://www.imagemagick.org/script/command-line-options.php#colorspace). |
|
||||
| rotation | string / boolean / integer | true | Determines whether the image should be rotated. Set this to true to auto-rotate images that are misrotated, or depend on EXIF rotation settings. You can also set this to an integer to specify the rotation in degrees. You can also specify degrees> to rotate only when the image width exceeds the height (or degrees< if the width must be less than the height). Specify false to disable auto-fixing of misrotated images. |
|
||||
| compress | string | null | Specifies pixel compression for when the image is written. Valid values are None, `"BZip"`, `"Fax"`, `"Group4"`, `"JPEG"`, `"JPEG2000"`, `"Lossless"`, `"LZW"`, `"RLE"`, and `"Zip"`. Compression is disabled by default. |
|
||||
| blur | string | null | Specifies gaussian blur, using a value with the form `{radius}x{sigma}`. The radius value specifies the size of area the operator should look at when spreading pixels, and should typically be either `"0"` or at least two times the sigma value. The sigma value is an approximation of how many pixels the image is "spread"; think of it as the size of the brush used to blur the image. This number is a floating point value, enabling small values like `"0.5"` to be used. For details about how the radius and sigma values affect blurring, see [this example](http://www.imagemagick.org/Usage/blur/blur_montage.jpg). |
|
||||
|
||||
**Watermark Parameters**
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| watermark_url | string | " " | A url indicating a PNG image to be overlaid above this image. |
|
||||
| watermark_position | string/array | "center" | The position at which the watermark is placed. The available options are `"center"`, `"top"`, `"bottom"`, `"left"`, and `"right"`. You can also combine options, such as `"bottom-right"`. An array of possible values can also be specified, in which case one value will be selected at random, such as `["center","left","bottom-left","bottom-right"]`. _Note that this setting puts the watermark in the specified corner. To use a specific pixel offset for the watermark, you will need to add the padding to the image itself._ |
|
||||
| watermark_size | string | "" | The size of the watermark, as a percentage. For example, a value of `"50%"` means that size of the watermark will be 50% of the size of image on which it is placed. |
|
||||
| watermark_resize_strategy | string | "fit" | Available values are `"fit"` and `"stretch"`. |
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
Creates a multi image upload field. Useful for a gallery or rotating image.
|
||||
|
||||
|
||||
|
||||
"images": {
|
||||
"title": "Images Field",
|
||||
"type": "images",
|
||||
"sizes": {
|
||||
"thumb": {
|
||||
"height": 150,
|
||||
"width": 150,
|
||||
"resize_strategy": "crop"
|
||||
},
|
||||
"large": {
|
||||
"height": 500,
|
||||
"width": 500,
|
||||
"resize_strategy": "crop"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
See [parameters table](https://github.com/justinwalsh/todaycms/wiki/Image).
|
||||
|
||||
See [resize strategies table](https://github.com/justinwalsh/todaycms/wiki/Resize-Strategies-Table).
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates an instance of the markItUp! universal markup editor. Editor allows easy access to HTML editing.
|
||||
|
||||
|
||||
|
||||
"markitup": {
|
||||
"title":"Markitup",
|
||||
"type":"markitup"
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
Creates a repeatable object that can utilize all TodayCMS field types.
|
||||
|
||||
|
||||
|
||||
"multi": {
|
||||
"title": "Multi Field",
|
||||
"display": "title",
|
||||
"type": "multi",
|
||||
"fields": {
|
||||
...
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| display | '' | | Field name to use as the identifier in the title cell. |
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
Creates a form field type that allows the selection of one or more items from a dropdown list.
|
||||
|
||||
|
||||
|
||||
### Static Options
|
||||
Displays a static list of options.
|
||||
|
||||
"multiselect": {
|
||||
"title": "Multi Select - Static",
|
||||
"type": "multiselect",
|
||||
"options": {
|
||||
"value": "Display Name",
|
||||
"value2": "Display Name 2"
|
||||
}
|
||||
}
|
||||
|
||||
### Reference Options
|
||||
Displays the records from another object in the config. This is commonly used to create multiple relational data associations.
|
||||
|
||||
"referenced-object": {
|
||||
"title": "Referenced Object",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Record Name",
|
||||
"type": "text"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
"multiselect": {
|
||||
"title": "Multi Select - Reference",
|
||||
"type": "multiselect",
|
||||
"options": "referenced-object",
|
||||
"display": "name"
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| options | '' | | A list of values (object), or reference name for another object in the config. |
|
||||
| display | '' | | Field name to use as the identifier in the dropdown select |
|
||||
|
||||
See also [[Select]].
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a password form field.
|
||||
|
||||
|
||||
|
||||
"password": {
|
||||
"title": "Password Field",
|
||||
"type": "password"
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
Creates a form field type that allows the selection of a single item from a dropdown list.
|
||||
|
||||
|
||||
|
||||
### Static Options
|
||||
Displays a static list of options.
|
||||
|
||||
"select": {
|
||||
"title": "Select Field - Static Options",
|
||||
"type": "select",
|
||||
"options": {
|
||||
"value1": "Display Name One",
|
||||
"value2": "Display Name Two",
|
||||
"value3": "Display Name Three"
|
||||
}
|
||||
}
|
||||
|
||||
### Reference Options
|
||||
Displays a list of the records from another object in the config. This is commonly used to create relational data association. For example, a list of categories or a grouping.
|
||||
|
||||
"referenced-object": {
|
||||
"title": "Referenced Object",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Record Name",
|
||||
"type": "text"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
"select-reference": {
|
||||
"title": "Select Field - Reference",
|
||||
"type": "select",
|
||||
"options": "referenced-object",
|
||||
"display": "name"
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| options | '' | | A list of values (object), or reference name for another object in the config. |
|
||||
| display | '' | | Field name to use as the identifier in the dropdown select |
|
||||
| blank | '' | string | String uses for the default dropdown select option. Value is set to null. |
|
||||
| hidden | false | true, false | Hides the select menu and passes a value through as a hidden field. |
|
||||
| value | | | Sets a default value. |
|
||||
|
||||
See also [[Multiselect]].
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a text form field.
|
||||
|
||||
|
||||
|
||||
"text": {
|
||||
"title": "Text Field",
|
||||
"type": "text"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a textarea form field.
|
||||
|
||||
|
||||
|
||||
"textarea": {
|
||||
"title": "Wysiwyg Field",
|
||||
"type": "textarea"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a WYSIWYG textarea form field.
|
||||
|
||||
|
||||
|
||||
"wysiwyg": {
|
||||
"title": "Wysiwyg Field",
|
||||
"type": "wysiwyg"
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
To create an editor on a page use the following code
|
||||
|
||||
<div id="cms-editor"></div>
|
||||
<script type="text/javascript" src="dist/js/todaycms.js"></script>
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings"
|
||||
});
|
||||
</script>
|
||||
|
||||
***Required***: 'apikey' and 'collection' are required parameters for the editor to load.
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
There are several customizations that can be made to the 'cms_setup' function.
|
||||
|
||||
##id
|
||||
Used to update an existing record.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
id: 12345
|
||||
});
|
||||
</script>
|
||||
|
||||
##config
|
||||
Overrides the collections configuration for only this editor.
|
||||
|
||||
In this example we are changing the visibility of the account field:
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
config: {
|
||||
fields: {
|
||||
account: {
|
||||
hidden:true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##data
|
||||
Overrides the data for this object
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
data: {
|
||||
account: 12345
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##before_save
|
||||
Function that is called before the object is saved to the api. It recieves a complete json copy of the object. Use this to make any modifications to the object before it is saved. If you return false, the save will be canceled, this is usefully for valdation errors.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
before_save: function(object) {
|
||||
if (object.first_name === '') {
|
||||
alert('Please enter a first name.');
|
||||
return false;
|
||||
} else {
|
||||
return object;
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##after_save
|
||||
Function that is called after the object has been saved. It recieves a complete json copy of the object that was just saved to the database.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
after_save: function(object) {
|
||||
window.location = "/account/listings/" + object.id;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##bootstrap
|
||||
Enable or disable the bootstrap css. Useful if bootstrap has already been loaded on the page.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
bootstrap: false
|
||||
});
|
||||
</script>
|
||||
|
||||
##theme
|
||||
Sets the theme. Availible themes: light or dark. The light theme is the default. Use false to disable the theme css.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
theme: false,
|
||||
// or
|
||||
// theme: 'dark'
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
The PHP SDK is a file called `connector.php` that makes it easier to work with the API. It contains helpers and functions that map to API calls.
|
||||
|
||||
Receive your unique API key details from [Todaymade] (http://todaymade.com/contact).
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
Create (or add) the 'config.json' and 'connector.php' files to the root of your website.
|
||||
|
||||
The connector.php file is the root of the CMS's power. To create a connection to the API server, include the connector.php file and create an instance of the Todaycms class using php.
|
||||
|
||||
```php
|
||||
<?php include($_SERVER["DOCUMENT_ROOT"]."/connector.php");
|
||||
$cms = new Todaycms('API_KEY_HERE'); ?>
|
||||
```
|
||||
|
||||
The $cms variable is now availible to start making calls to the api
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
To debug your api calls and to find out what data is available to your page. Add '?debug' to the ending of any url.
|
||||
|
||||
http://yourdomain.com?debug
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Returns the config object that is assosicated with the current API key.
|
||||
|
||||
To retreive the config simply use the $cms variable:
|
||||
|
||||
$config = $cms->config();
|
||||
|
||||
You can also filter your config to a specific collection.
|
||||
|
||||
$team_config = $cms->config("team");
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
Single is the heart of any website. It represents a single record in the CMS system.
|
||||
|
||||
To make a call to the api simply use the $cms variable:
|
||||
|
||||
$page = $cms->key("OBJECT-NAME")->single();
|
||||
|
||||
Call a single record by ID
|
||||
|
||||
$cms->key(1234)->single();
|
||||
|
||||
Call a single record by slug
|
||||
|
||||
$cms->parent(key)->slug(about-us)->single();
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Multiple objects represent a group of records in the CMS system.
|
||||
|
||||
To make a call to the api simply use the $cms variable:
|
||||
|
||||
$pages = $cms->key("OBJECT-NAME")->multiple();
|
||||
|
||||
You can also filter your results base field name.
|
||||
|
||||
$pages = $cms->key("OBJECT-NAME")->filter(FIELD-NAME, FIELD-VALUE)->multiple();
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
This helper was added to the connector.php file, version 2.*. It is designed to display a fully-functioning AJAX web form with validation built in.
|
||||
|
||||
```php
|
||||
<? if (isset($page['fields']['form'])) {
|
||||
$cms->formbuilder($page['fields']['form'], $page);
|
||||
}
|
||||
?>
|
||||
```
|
||||
|
||||
Returns: HTML/JS
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
"title": "DAUX.IO",
|
||||
"tagline": "The Easiest Way To Document Your App",
|
||||
"image": "/img/app.png",
|
||||
"theme": "blue",
|
||||
"theme": "navy",
|
||||
"repo": "justinwalsh/tm-docs",
|
||||
"twitter": ["justin_walsh", "todaymade"],
|
||||
"links": {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,25 @@
|
|||
This is my homepage content!
|
||||
<p class="lead">
|
||||
<strong>Daux.io</strong> is an documentation generator that uses a simple folder structure and Markdown files to create custom documentation on the fly. It helps you create great looking documentation in a developer friendly way.
|
||||
</p>
|
||||
|
||||
* Its really cool
|
||||
* Yes it is
|
||||
<hr/>
|
||||
<h3>Features</h3>
|
||||
<hr/>
|
||||
|
||||
<img src="/img/app-thumbs.png" alt="alt text" class="pull-right" style="margin-bottom:20px;">
|
||||
|
||||
* 100% Mobile Responsive
|
||||
* Supports GitHub Flavored Markdown
|
||||
* Auto created homepage/landing page
|
||||
* Auto Syntax Highlighting
|
||||
* Auto Generated Navigation
|
||||
* 4 Built-In Themes or roll your own
|
||||
* Functional, Flat Design Style
|
||||
* Shareable/Linkable SEO Friendly URLs
|
||||
* Built On Bootstrap
|
||||
* No Build Step
|
||||
* Git/SVN Friendly
|
||||
* Optional code float layout
|
||||
|
||||
<div class="clear"></div>
|
||||
<hr/>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 91 KiB |
BIN
img/app.png
BIN
img/app.png
Binary file not shown.
|
Before Width: | Height: | Size: 208 KiB After Width: | Height: | Size: 235 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
106
index.php
106
index.php
|
|
@ -70,11 +70,24 @@ software, even if advised of the possibility of such damage.
|
|||
$options = get_options();
|
||||
$tree = get_tree("docs");
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
|
||||
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
|
||||
<html>
|
||||
<head>
|
||||
<title><?=$options['title']; ?></title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="description" content="<?=$options['tagline'];?>" />
|
||||
<meta name="author" content="<?=$options['title']; ?>">
|
||||
<? if ($options['colors']) { ?>
|
||||
<link rel="icon" href="/img/favicon.png" type="image/x-icon">
|
||||
<? } else { ?>
|
||||
<link rel="icon" href="/img/favicon-<?=$options['theme'];?>.png" type="image/x-icon">
|
||||
<? } ?>
|
||||
<!-- Mobile -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<!-- Font -->
|
||||
|
|
@ -100,28 +113,101 @@ software, even if advised of the possibility of such damage.
|
|||
<!-- Navigation -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<? if ($homepage) { ?>
|
||||
<!-- Hompage -->
|
||||
<h1><?=$options['title'];?></h1>
|
||||
<div class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container">
|
||||
<a class="brand pull-left" href="/"><?=$options['title']; ?></a>
|
||||
<p class="navbar-text pull-right">
|
||||
Generated by <a href="http://daux.io">Daux.io</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<? if ($options['tagline']) { ?>
|
||||
<h2><?=$options['tagline'];?></h2>
|
||||
<? } ?>
|
||||
<div class="homepage-hero well container-fluid">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="text-center span12">
|
||||
<? if ($options['tagline']) { ?>
|
||||
<h2><?=$options['tagline'];?></h2>
|
||||
<? } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span10 offset1">
|
||||
<? if ($options['image']) { ?>
|
||||
<img class="homepage-image" src="<?=$options['image'];?>" alt="<?=$options['title'];?>">
|
||||
<? } ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<? if ($options['image']) { ?>
|
||||
<img width="800" src="<?=$options['image'];?>" alt="<?=$options['title'];?>">
|
||||
<? } ?>
|
||||
<div class="hero-buttons container-fluid">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="text-center span12">
|
||||
<a href="#" class="btn btn-secondary btn-hero">
|
||||
View On GitHub
|
||||
</a>
|
||||
<a href="#" class="btn btn-primary btn-hero">
|
||||
View Documentation
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<? echo load_page($tree); ?>
|
||||
<div class="homepage-content container-fluid">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="span10 offset1">
|
||||
<? echo load_page($tree); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="homepage-footer well container-fluid">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="span5 offset1">
|
||||
<? if (!empty($options['links'])) { ?>
|
||||
<ul class="footer-nav">
|
||||
<? foreach($options['links'] as $name => $url) { ?>
|
||||
<li><a href="<?=$url;?>" target="_blank"><?=$name;?></a></li>
|
||||
<? } ?>
|
||||
</ul>
|
||||
<? } ?>
|
||||
</div>
|
||||
<div class="span5">
|
||||
<div class="pull-right">
|
||||
<? if (!empty($options['twitter'])) { ?>
|
||||
<? foreach($options['twitter'] as $handle) { ?>
|
||||
<div class="twitter">
|
||||
<iframe allowtransparency="true" frameborder="0" scrolling="no" style="width:162px; height:20px;" src="https://platform.twitter.com/widgets/follow_button.html?screen_name=<?=$handle;?>&show_count=false"></iframe>
|
||||
</div>
|
||||
<? } ?>
|
||||
<? } ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<? } else { ?>
|
||||
<!-- Docs -->
|
||||
<? if ($options['repo']) { ?>
|
||||
<a href="https://github.com/<?=$options['repo']; ?>" target="_blank" id="github-ribbon"><img src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
|
||||
<? } ?>
|
||||
<div class="container-fluid wrapper">
|
||||
<div class="container-fluid fluid-height wrapper">
|
||||
<div class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<a class="brand pull-left" href="/"><?=$options['title']; ?></a>
|
||||
|
|
|
|||
|
|
@ -73,7 +73,130 @@ pre {
|
|||
}
|
||||
|
||||
/* ===========================================================================================
|
||||
Body & Page Structure
|
||||
Homepage
|
||||
============================================================================================== */
|
||||
|
||||
.homepage-hero {
|
||||
padding-top: 50px !important;
|
||||
background-color: @light;
|
||||
.kill-box-shadow;
|
||||
.border-radius(0px);
|
||||
border: none;
|
||||
color: @dark;
|
||||
overflow: hidden;
|
||||
@media (max-width: 767px) {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
.text-center {
|
||||
.roboto-slab.bold;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
h2 {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.homepage-image {
|
||||
.box-shadow(10px, rgba(0,0,0,0.20), 0px, 0px);
|
||||
}
|
||||
}
|
||||
.hero-buttons.container-fluid {
|
||||
padding: 20px 0px;
|
||||
background-color: @sidebar-hover;
|
||||
.btn-hero.btn {
|
||||
.roboto-slab.bold;
|
||||
padding: 20px 30px;
|
||||
.kill-background-image;
|
||||
.kill-box-shadow;
|
||||
.border-radius(0px);
|
||||
text-shadow:none;
|
||||
border: none;
|
||||
.opacity(0.80);
|
||||
margin: 0px 10px;
|
||||
text-transform: uppercase;
|
||||
border: 5px solid @dark;
|
||||
@media (max-width: 767px) {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
&:hover {
|
||||
.opacity(1.0);
|
||||
}
|
||||
&.btn-secondary {
|
||||
background-color: @sidebar-hover;
|
||||
color: @dark;
|
||||
}
|
||||
&.btn-primary {
|
||||
background-color: @dark;
|
||||
color: @sidebar-background;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.homepage-content.container-fluid {
|
||||
// color: white;
|
||||
// background-color: @text;
|
||||
background-color: white;
|
||||
padding: 40px 0px;
|
||||
.lead {
|
||||
.roboto-slab.regular;
|
||||
}
|
||||
ul, ol {
|
||||
padding: 20px 0px;
|
||||
margin: 0 0 10px 0px;
|
||||
li {
|
||||
list-style: none;
|
||||
padding-bottom: 5px;
|
||||
&:before {
|
||||
content: '';
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border: 3px solid transparent;
|
||||
border-left: 3px solid @light;
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.homepage-footer.container-fluid {
|
||||
background-color: @dark;
|
||||
.kill-box-shadow;
|
||||
.border-radius(0px);
|
||||
color: light;
|
||||
border: none;
|
||||
@media (max-width: 767px) {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.footer-nav {
|
||||
margin: 40px 0px;
|
||||
li {
|
||||
list-style: none;
|
||||
a {
|
||||
.roboto-slab.bold;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
&:hover {
|
||||
color: @light;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.twitter {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.twitter:first-child {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ===========================================================================================
|
||||
Docs Body & Page Structure
|
||||
============================================================================================== */
|
||||
|
||||
html, body {
|
||||
|
|
@ -87,11 +210,13 @@ html, body {
|
|||
//100% Height Columns
|
||||
.container-fluid {
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
&.fluid-height {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.columns {
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
Welcome to the TodayCMS docs. This site contains documentation and examples of how to use TodayCMS, the powerful Content Management System. Here is a breakdown of what this documentation will cover.
|
||||
|
||||
## API
|
||||
The api is the server endpoint for creating, reading, updating and deleting objects from collections in the database.
|
||||
|
||||
##Config
|
||||
The config is used to define the objects in your collections in json.
|
||||
|
||||
## Editor
|
||||
The editor is an embedable tool, for creating and updating objects in a collection.
|
||||
|
||||
## PHP SDK
|
||||
The PHP SDK is a file called connector.php that makes it easier to work with the API. It contains helpers and functions that map to API calls.
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
All calls to the api must include a _token parameter to validate the call.
|
||||
|
||||
http://todaycms-api.herokuapp.com/?_token=XXXXXXXXXXXX
|
||||
|
||||
This guide will not include the _token in the sample calls. It is implied that it must be included.
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
The following collection config will be used as the config throughout the example calls in this guide.
|
||||
|
||||
{
|
||||
"team": {
|
||||
"title": "Team Members",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Name",
|
||||
"type": "text"
|
||||
},
|
||||
"employment": {
|
||||
"title": "Employment Status",
|
||||
"type": "select",
|
||||
"options": {
|
||||
"half": "Part Time",
|
||||
"full": "Full Time",
|
||||
"retired": "Retired"
|
||||
}
|
||||
},
|
||||
"bio": {
|
||||
"title": "Bio",
|
||||
"type": "textarea"
|
||||
},
|
||||
"address": {
|
||||
"title": "Home Address",
|
||||
"type": "location"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
To create an object in a collection, issue a HTTP POST call with the object in the body of the POST.
|
||||
|
||||
POST /collections/:collection
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
**Example**
|
||||
|
||||
POST /collections/team
|
||||
|
||||
name = Justin
|
||||
employment = full
|
||||
bio = Node.js developer
|
||||
address[city] = Bismarck
|
||||
address[state] = ND
|
||||
address[zip] = 58501
|
||||
...
|
||||
|
||||
Note: 'team' is the key used in our example config at the top of this guide
|
||||
|
||||
**Returns**
|
||||
|
||||
The object you just created.
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
To read from a collection, issue a HTTP GET call
|
||||
|
||||
GET /collections/:collection
|
||||
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
**Returns**
|
||||
|
||||
An array of objects from the collection.
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
To update an object in a collection, issue a HTTP POST call with the object in the body of the POST.
|
||||
|
||||
POST /collections/:collection/:id
|
||||
|
||||
name = Justin Walsh
|
||||
employment = part
|
||||
bio = Documention writer
|
||||
...
|
||||
|
||||
**URL Parameters**
|
||||
|
||||
`:collection` is the key of the collection in the config.
|
||||
|
||||
`:id` is the id of the object you want to update.
|
||||
|
||||
**Returns**
|
||||
|
||||
The object you just updated.
|
||||
|
|
@ -0,0 +1 @@
|
|||
Coming Soon
|
||||
|
|
@ -0,0 +1,152 @@
|
|||
To filter an api call, send the optional `filter` parameter. The filter parameter is a structured json object. Examples use the following terms:
|
||||
|
||||
* field key - Is the key used to define the field in the config.
|
||||
* operator - Is the comparison to preform.
|
||||
* value - Is what we will compare the object value to.
|
||||
|
||||
## Basic Structure
|
||||
|
||||
This is the most basic filter that can be preformed.
|
||||
|
||||
{
|
||||
"field key": "value"
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"employment":"full"}
|
||||
|
||||
This will find all full time team members in the collection.
|
||||
|
||||
## Advanced Structure
|
||||
|
||||
This structure allows more advanced control over operators used when filtering.
|
||||
|
||||
{
|
||||
"field key": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"employment": {"!=": "retired"}}
|
||||
|
||||
This will find all team members who are not retired in the collection.
|
||||
|
||||
## Multiple Operators Structure
|
||||
|
||||
You can preform multiple comparision operations on the same field
|
||||
|
||||
{
|
||||
"field key": {
|
||||
"operator": "value",
|
||||
"operator2": "value2",
|
||||
"operatorx..": "valuex.."
|
||||
}
|
||||
}
|
||||
|
||||
*Example Call:*
|
||||
|
||||
GET /collections/team?filter={"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}
|
||||
|
||||
This will find all team members who's names start with 'Justin' but are not 'Justin Walsh'.
|
||||
|
||||
## Multiple Fields Structure
|
||||
|
||||
You can filter multiple fields by adding each field key to the object.
|
||||
|
||||
{
|
||||
"field key 1": "value",
|
||||
"field key 2": {
|
||||
"operator": "value"
|
||||
},
|
||||
"field key 3": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
|
||||
## Multiple Values Structure
|
||||
|
||||
When filtering, you can use an array instead of a string to match any of the values in the array.
|
||||
|
||||
{
|
||||
"employment": ["full", "part"],
|
||||
"name": {
|
||||
"LIKE": ["Justin%", "Brian%"]
|
||||
}
|
||||
}
|
||||
|
||||
This will match all team members who are full or part time, and whose names starts with 'Justin' or 'Brian'.
|
||||
|
||||
Note: `"employment": ["full", "part"]` is equvalient to
|
||||
|
||||
"employment": {
|
||||
"=": ["full", "part"]
|
||||
}
|
||||
|
||||
## Nested Fields Structure
|
||||
|
||||
You can filter by nested fields in the object using a dot notation syntax as the field key in the filter. This syntax can be used to query deep into nested objects and arrays, including fields like the 'multi'.
|
||||
|
||||
{
|
||||
"address.zip": "58501"
|
||||
}
|
||||
|
||||
This will filter the location field type by zip code, which is a nested field. This example is based on the sample config at the top of this guide.
|
||||
|
||||
## AND/OR Fields Structure (Not Supported Yet)
|
||||
|
||||
This structure allows a very customized query including both `-and` and `-or` statments.
|
||||
|
||||
{
|
||||
"field key 3": {
|
||||
"operator": "value"
|
||||
},
|
||||
"-or": {
|
||||
"field key 1": "value",
|
||||
"-and": {
|
||||
"field key 2": {
|
||||
"operator": "value"
|
||||
},
|
||||
"field key 4": {
|
||||
"operator": "value"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
## Supported Operators
|
||||
|
||||
| Operator | Description |
|
||||
| :--- | :--- |
|
||||
| = | equal to |
|
||||
| != | not equal to |
|
||||
| > | greater than |
|
||||
| < | less than |
|
||||
| >= | greater than or equal to |
|
||||
| <= | less than or equal to |
|
||||
| LIKE | case sensitive search, use '%' for wildcard |
|
||||
| ILIKE | case insensitive search, use '%' for wildcard |
|
||||
| NOT LIKE | inverse of 'LIKE' |
|
||||
| NOT ILIKE | inverse of 'ILIKE' |
|
||||
|
||||
|
||||
## Notes
|
||||
|
||||
**JSON Filtering**
|
||||
|
||||
The JSON object used for the `filter` parameter must be url encoded when calling the api. Here are examples of how to url encode a json object or string in different languages.
|
||||
|
||||
***php***
|
||||
|
||||
$escaped_json = urlencode('{"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}');
|
||||
|
||||
***javascript string***
|
||||
|
||||
var escaped_json_from_string = escape('{"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}');
|
||||
|
||||
***javascript object***
|
||||
|
||||
var escaped_json_from_object = escape(JSON.stringify({"name": {"LIKE":"Justin%", "!=":"Justin Walsh"}}));
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
A config object that contains other objects (admin sections) and displays them in a group.
|
||||
|
||||
Parent elements are characterized by a subhead in the admin panel navigation. They also group elements in the [[Outline (call)]].
|
||||
|
||||
{
|
||||
"sample_parent": {
|
||||
"title": "Sample Parent",
|
||||
"type": "parent"
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the object. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | parent | Object identifier. Required, must be set to: 'parent' |
|
||||
|
||||
### Single
|
||||
The Single object is created in the config.json file. This will create a single page that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"single-name": {
|
||||
"title": "single-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "single",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the page. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | single | Object identifier. Required, must be set to: 'single.' |
|
||||
| parent | - | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | Allows you to hide or show object elements in the admin panel. |
|
||||
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
The Single object is created in the config.json file. This will create a single page that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"single-name": {
|
||||
"title": "single-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "single",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
### Parameters
|
||||
| Name | Default | Description |
|
||||
| :------------- | :------------- | :------------- |
|
||||
| title | required | Descriptive title of the page. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | single | Object identifier. Required, must be set to: 'single.' |
|
||||
| parent | - | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | Allows you to hide or show object elements in the admin panel. |
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
The Multiple object is created in the 'config.json' file. This will create a group of many pages (records) that can be edited in the admin panel and displayed on the front end.
|
||||
|
||||
{
|
||||
"multiple-name": {
|
||||
"title": "multiple-title",
|
||||
"parent": "sample_parent",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| :------------- | :------------- | :------------- | :------------- |
|
||||
| title | required | | Descriptive title of the object. This value will be used to identify the object in the admin panel sidebar navigation. Required field. |
|
||||
| type | multiple | | Object identifier. Required, must be set to: 'multiple.' |
|
||||
| parent | '' | | Defines parent container object. Allows you to group multiple objects together in the admin panel (like a folder). |
|
||||
| nav | true | true,false | Allows you to hide or show object elements in the admin panel. |
|
||||
| filters | '' | | Creates a select menu in the admin panel that will filter returned records. |
|
||||
| sort | '' | asc, desc | Sorts records on call. |
|
||||
| display | '' | | Defines values to display in the admin output table for each record. |
|
||||
| download | true | true,false | Enables raw data download from admin panel. (csv file) |
|
||||
| redirects | true | true,false | Enables option to create link (url) based records. |
|
||||
| publish | true | true,false | Removes ability to save individual record as draft. |
|
||||
|
||||
## Filters Example
|
||||
|
||||
{
|
||||
"filters": ["value"]
|
||||
}
|
||||
|
||||
## Sort Example
|
||||
{
|
||||
"sort":{
|
||||
"value":"asc"
|
||||
}
|
||||
}
|
||||
|
||||
## Display Example
|
||||
{
|
||||
"display":["fname", "lname", "phone", "email"]
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a color picker field that will return a hex value through the API.
|
||||
|
||||
|
||||
|
||||
"color": {
|
||||
"title": "Color Picker",
|
||||
"type": "colorpicker"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a single date field with a visual calendar drop down.
|
||||
|
||||
|
||||
|
||||
"date": {
|
||||
"title": "Date Field",
|
||||
"type": "date"
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
Creates a single date and time field with a visual drop down for each.
|
||||
|
||||
|
||||
|
||||
"datetime": {
|
||||
"title": "Date Time Field",
|
||||
"type": "datetime"
|
||||
}
|
||||
|
||||
Returns a single date/time value.
|
||||
|
||||
[datetime] => 01/16/2012 12:00 am
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Creates a page divider with customizable text. Visible only from the CMS.
|
||||
|
||||
|
||||
|
||||
"divider-1": {
|
||||
"title": "Page Divider",
|
||||
"type": "divider"
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
Creates a single file upload field.
|
||||
|
||||
|
||||
|
||||
"file": {
|
||||
"title": "File Field",
|
||||
"type": "file"
|
||||
}
|
||||
|
||||
Returns an array.
|
||||
|
||||
[file] => Array
|
||||
(
|
||||
[caption] =>
|
||||
[date] => 11/1/2012
|
||||
[url] => http://todaycms.s3.amazonaws.com/...filename.pdf
|
||||
[name] => filename.pdf
|
||||
)
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
Creates multiple file upload fields with sort and caption options.
|
||||
|
||||
|
||||
|
||||
"files": {
|
||||
"title": "Files Field",
|
||||
"type": "files"
|
||||
}
|
||||
|
||||
Returns a multidimensional array.
|
||||
|
||||
[files] => Array
|
||||
(
|
||||
[0] => Array
|
||||
(
|
||||
[caption] => Pre-Order Form
|
||||
[date] => 2/13/2012
|
||||
[url] => http://todaycms.s3.amazonaws.com/...filename.pdf
|
||||
[name] => Author Visit - Beth McKinney.pdf
|
||||
)
|
||||
)
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
Creates an instance of the TodayCMS FormBuilder. This will allow end users to create complex forms with a variety of options for data collection and submission.
|
||||
|
||||
|
||||
|
||||
"form": {
|
||||
"title": "Form Builder",
|
||||
"type": "formbuilder"
|
||||
}
|
||||
|
||||
**Available Fields**
|
||||
|
||||
* Single Line Text
|
||||
* Multiple Line Text
|
||||
* Dropdown Select
|
||||
* Checkbox Options
|
||||
* Multiple Choice (Radio Buttons)
|
||||
* Phone
|
||||
* Email
|
||||
|
||||
**Form Actions**
|
||||
|
||||
* Redirect to another page
|
||||
* Display a message
|
||||
* Send to Paypal
|
||||
|
||||
**Returns**
|
||||
|
||||
See the [[Formbuilder (helper)]]
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
Creates a hidden form field.
|
||||
|
||||
"hidden": {
|
||||
"title": "Hidden Field",
|
||||
"type": "hidden",
|
||||
}
|
||||
|
||||
"hidden-forced-value": {
|
||||
"title": "Hidden Forced Value Field",
|
||||
"type": "hidden",
|
||||
"value": "Forced Value"
|
||||
}
|
||||
|
||||
"hidden-default-value": {
|
||||
"title": "Hidden Default Value Field",
|
||||
"type": "hidden",
|
||||
"default": "Default Value"
|
||||
}
|
||||
|
||||
"hidden-timestamp-value": {
|
||||
"title": "Hidden Timestamp Value Field",
|
||||
"type": "hidden",
|
||||
"default": "timestamp"
|
||||
}
|
||||
|
||||
"hidden-display-value": {
|
||||
"title": "Hidden Display Field",
|
||||
"type": "hidden",
|
||||
"value": "You should see this",
|
||||
"display": true
|
||||
}
|
||||
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| default | '' | string, timestamp | Sets a default value for the hidden field. Timestamp will display current date/time. |
|
||||
| display | false | true,false | Can see the value but can't change it |
|
||||
| auto_increment | false | true, false | Creates unique id starting with 1. |
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
Creates a single image upload field.
|
||||
|
||||
|
||||
|
||||
"image": {
|
||||
"title": "Image Field",
|
||||
"type": "image",
|
||||
"sizes": {
|
||||
"thumb": {
|
||||
"height": 150,
|
||||
"width": 150,
|
||||
"resize_strategy": "crop"
|
||||
},
|
||||
"large": {
|
||||
"height": 500,
|
||||
"width": 500,
|
||||
"resize_strategy": "fit"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Image fields allows you to determine multiple thumbnail/image sizes and cropping techniques.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| width | 1-5000 | Width of the input image | Width of the new image, in pixels |
|
||||
| height | 1-5000 | Height of the input image | Height of the new image, in pixels |
|
||||
| strip | boolean | false | Strips all metadata from the image. This is useful to keep thumbnails as small as possible. |
|
||||
| flatten | boolean | true | Flattens all layers onto the specified background to achive better results from transparent formats to non-transparent formats, as explained in the [ImageMagick](http://www.imagemagick.org/script/command-line-options.php?#layers) documentation. **Important:** To preserve animations, GIF files are not flattened when this is set to true. To flatten GIF animations, use the frame parameter. |
|
||||
| correct_gamma | boolean | false | Prevents gamma errors [common in many image scaling algorithms](http://www.4p8.com/eric.brasseur/gamma.html). |
|
||||
| quality | 1-100 | Quality of the input image, or 92 | Controls the image compression for JPG and PNG images. |
|
||||
| background | string | "#FFFFFF" | Either the hexadecimal code or [name](http://www.imagemagick.org/script/color.php#color_names) of the color used to fill the background (only used for the pad resize strategy). **Important:** By default, the background of transparent images is changed to white. For details about how to preserve transparency across all image types, see [this demo](https://transloadit.com/demos/image-resize/properly-preserve-transparency-across-all-image-types). |
|
||||
| resize_strategy | string | "fit" | See [[Resize Strategies Table]] |
|
||||
| zoom | boolean | true | If this is set to false, smaller images will not be stretched to the desired width and height. For details about the impact of zooming for your preferred resize strategy, see the [[Resize Strategies Table]]. |
|
||||
| crop | { x1: integer, y1: integer, x2: integer, y2: integer } | {} | Specify an object containing coordinates for the top left and bottom right corners of the rectangle to be cropped from the original image(s). For example, `{x1: 80, y1: 100, x2: 160, y2: 180}` will crop the area from `(80,100)` to `(160,180)` which is a square whose width and height are 80px. If crop is set, the width and height parameters are ignored, and the resize_strategy is set to crop automatically. |
|
||||
| format | string | Format of the input image | The available formats are `"jpg"`, `"png"`, `"gif"`, and `"tiff"`. |
|
||||
| gravity | string | center | The direction from which the image is to be cropped. The available options are `"center"`, `"top"`, `"bottom"`, `"left"`, and `"right"`. You can also combine options with a hyphen, such as `"bottom-right"`. |
|
||||
| frame | integer | null (all frames) | Use this parameter when dealing with animated GIF files to specify which frame of the GIF is used for the operation. Specify 1 to use the first frame, 2 to use the second, and so on. |
|
||||
| colorspace | string | " " | Sets the image colorspace. For details about the available values, see the [ImageMagick documentation](http://www.imagemagick.org/script/command-line-options.php#colorspace). |
|
||||
| rotation | string / boolean / integer | true | Determines whether the image should be rotated. Set this to true to auto-rotate images that are misrotated, or depend on EXIF rotation settings. You can also set this to an integer to specify the rotation in degrees. You can also specify degrees> to rotate only when the image width exceeds the height (or degrees< if the width must be less than the height). Specify false to disable auto-fixing of misrotated images. |
|
||||
| compress | string | null | Specifies pixel compression for when the image is written. Valid values are None, `"BZip"`, `"Fax"`, `"Group4"`, `"JPEG"`, `"JPEG2000"`, `"Lossless"`, `"LZW"`, `"RLE"`, and `"Zip"`. Compression is disabled by default. |
|
||||
| blur | string | null | Specifies gaussian blur, using a value with the form `{radius}x{sigma}`. The radius value specifies the size of area the operator should look at when spreading pixels, and should typically be either `"0"` or at least two times the sigma value. The sigma value is an approximation of how many pixels the image is "spread"; think of it as the size of the brush used to blur the image. This number is a floating point value, enabling small values like `"0.5"` to be used. For details about how the radius and sigma values affect blurring, see [this example](http://www.imagemagick.org/Usage/blur/blur_montage.jpg). |
|
||||
|
||||
**Watermark Parameters**
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| watermark_url | string | " " | A url indicating a PNG image to be overlaid above this image. |
|
||||
| watermark_position | string/array | "center" | The position at which the watermark is placed. The available options are `"center"`, `"top"`, `"bottom"`, `"left"`, and `"right"`. You can also combine options, such as `"bottom-right"`. An array of possible values can also be specified, in which case one value will be selected at random, such as `["center","left","bottom-left","bottom-right"]`. _Note that this setting puts the watermark in the specified corner. To use a specific pixel offset for the watermark, you will need to add the padding to the image itself._ |
|
||||
| watermark_size | string | "" | The size of the watermark, as a percentage. For example, a value of `"50%"` means that size of the watermark will be 50% of the size of image on which it is placed. |
|
||||
| watermark_resize_strategy | string | "fit" | Available values are `"fit"` and `"stretch"`. |
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
Creates a multi image upload field. Useful for a gallery or rotating image.
|
||||
|
||||
|
||||
|
||||
"images": {
|
||||
"title": "Images Field",
|
||||
"type": "images",
|
||||
"sizes": {
|
||||
"thumb": {
|
||||
"height": 150,
|
||||
"width": 150,
|
||||
"resize_strategy": "crop"
|
||||
},
|
||||
"large": {
|
||||
"height": 500,
|
||||
"width": 500,
|
||||
"resize_strategy": "crop"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
See [parameters table](https://github.com/justinwalsh/todaycms/wiki/Image).
|
||||
|
||||
See [resize strategies table](https://github.com/justinwalsh/todaycms/wiki/Resize-Strategies-Table).
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates an instance of the markItUp! universal markup editor. Editor allows easy access to HTML editing.
|
||||
|
||||
|
||||
|
||||
"markitup": {
|
||||
"title":"Markitup",
|
||||
"type":"markitup"
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
Creates a repeatable object that can utilize all TodayCMS field types.
|
||||
|
||||
|
||||
|
||||
"multi": {
|
||||
"title": "Multi Field",
|
||||
"display": "title",
|
||||
"type": "multi",
|
||||
"fields": {
|
||||
...
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| display | '' | | Field name to use as the identifier in the title cell. |
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
Creates a form field type that allows the selection of one or more items from a dropdown list.
|
||||
|
||||
|
||||
|
||||
### Static Options
|
||||
Displays a static list of options.
|
||||
|
||||
"multiselect": {
|
||||
"title": "Multi Select - Static",
|
||||
"type": "multiselect",
|
||||
"options": {
|
||||
"value": "Display Name",
|
||||
"value2": "Display Name 2"
|
||||
}
|
||||
}
|
||||
|
||||
### Reference Options
|
||||
Displays the records from another object in the config. This is commonly used to create multiple relational data associations.
|
||||
|
||||
"referenced-object": {
|
||||
"title": "Referenced Object",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Record Name",
|
||||
"type": "text"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
"multiselect": {
|
||||
"title": "Multi Select - Reference",
|
||||
"type": "multiselect",
|
||||
"options": "referenced-object",
|
||||
"display": "name"
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| options | '' | | A list of values (object), or reference name for another object in the config. |
|
||||
| display | '' | | Field name to use as the identifier in the dropdown select |
|
||||
|
||||
See also [[Select]].
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a password form field.
|
||||
|
||||
|
||||
|
||||
"password": {
|
||||
"title": "Password Field",
|
||||
"type": "password"
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
Creates a form field type that allows the selection of a single item from a dropdown list.
|
||||
|
||||
|
||||
|
||||
### Static Options
|
||||
Displays a static list of options.
|
||||
|
||||
"select": {
|
||||
"title": "Select Field - Static Options",
|
||||
"type": "select",
|
||||
"options": {
|
||||
"value1": "Display Name One",
|
||||
"value2": "Display Name Two",
|
||||
"value3": "Display Name Three"
|
||||
}
|
||||
}
|
||||
|
||||
### Reference Options
|
||||
Displays a list of the records from another object in the config. This is commonly used to create relational data association. For example, a list of categories or a grouping.
|
||||
|
||||
"referenced-object": {
|
||||
"title": "Referenced Object",
|
||||
"type": "multiple",
|
||||
"fields": {
|
||||
"name": {
|
||||
"title": "Record Name",
|
||||
"type": "text"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
"select-reference": {
|
||||
"title": "Select Field - Reference",
|
||||
"type": "select",
|
||||
"options": "referenced-object",
|
||||
"display": "name"
|
||||
}
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Default | Options | Description |
|
||||
| ------------- | ------------- | ------------- | ------------- |
|
||||
| options | '' | | A list of values (object), or reference name for another object in the config. |
|
||||
| display | '' | | Field name to use as the identifier in the dropdown select |
|
||||
| blank | '' | string | String uses for the default dropdown select option. Value is set to null. |
|
||||
| hidden | false | true, false | Hides the select menu and passes a value through as a hidden field. |
|
||||
| value | | | Sets a default value. |
|
||||
|
||||
See also [[Multiselect]].
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a text form field.
|
||||
|
||||
|
||||
|
||||
"text": {
|
||||
"title": "Text Field",
|
||||
"type": "text"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a textarea form field.
|
||||
|
||||
|
||||
|
||||
"textarea": {
|
||||
"title": "Wysiwyg Field",
|
||||
"type": "textarea"
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
Creates a WYSIWYG textarea form field.
|
||||
|
||||
|
||||
|
||||
"wysiwyg": {
|
||||
"title": "Wysiwyg Field",
|
||||
"type": "wysiwyg"
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
To create an editor on a page use the following code
|
||||
|
||||
<div id="cms-editor"></div>
|
||||
<script type="text/javascript" src="dist/js/todaycms.js"></script>
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings"
|
||||
});
|
||||
</script>
|
||||
|
||||
***Required***: 'apikey' and 'collection' are required parameters for the editor to load.
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
There are several customizations that can be made to the 'cms_setup' function.
|
||||
|
||||
##id
|
||||
Used to update an existing record.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
id: 12345
|
||||
});
|
||||
</script>
|
||||
|
||||
##config
|
||||
Overrides the collections configuration for only this editor.
|
||||
|
||||
In this example we are changing the visibility of the account field:
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
config: {
|
||||
fields: {
|
||||
account: {
|
||||
hidden:true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##data
|
||||
Overrides the data for this object
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
data: {
|
||||
account: 12345
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##before_save
|
||||
Function that is called before the object is saved to the api. It recieves a complete json copy of the object. Use this to make any modifications to the object before it is saved. If you return false, the save will be canceled, this is usefully for valdation errors.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
before_save: function(object) {
|
||||
if (object.first_name === '') {
|
||||
alert('Please enter a first name.');
|
||||
return false;
|
||||
} else {
|
||||
return object;
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##after_save
|
||||
Function that is called after the object has been saved. It recieves a complete json copy of the object that was just saved to the database.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
after_save: function(object) {
|
||||
window.location = "/account/listings/" + object.id;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
##bootstrap
|
||||
Enable or disable the bootstrap css. Useful if bootstrap has already been loaded on the page.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
bootstrap: false
|
||||
});
|
||||
</script>
|
||||
|
||||
##theme
|
||||
Sets the theme. Availible themes: light or dark. The light theme is the default. Use false to disable the theme css.
|
||||
|
||||
<script type='text/javascript'>
|
||||
cms_setup({
|
||||
apikey: '7DdPrtGp9ZhKmk',
|
||||
collection: "listings",
|
||||
theme: false,
|
||||
// or
|
||||
// theme: 'dark'
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
The PHP SDK is a file called `connector.php` that makes it easier to work with the API. It contains helpers and functions that map to API calls.
|
||||
|
||||
Receive your unique API key details from [Todaymade] (http://todaymade.com/contact).
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
Create (or add) the 'config.json' and 'connector.php' files to the root of your website.
|
||||
|
||||
The connector.php file is the root of the CMS's power. To create a connection to the API server, include the connector.php file and create an instance of the Todaycms class using php.
|
||||
|
||||
```php
|
||||
<?php include($_SERVER["DOCUMENT_ROOT"]."/connector.php");
|
||||
$cms = new Todaycms('API_KEY_HERE'); ?>
|
||||
```
|
||||
|
||||
The $cms variable is now availible to start making calls to the api
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
To debug your api calls and to find out what data is available to your page. Add '?debug' to the ending of any url.
|
||||
|
||||
http://yourdomain.com?debug
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Returns the config object that is assosicated with the current API key.
|
||||
|
||||
To retreive the config simply use the $cms variable:
|
||||
|
||||
$config = $cms->config();
|
||||
|
||||
You can also filter your config to a specific collection.
|
||||
|
||||
$team_config = $cms->config("team");
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
Single is the heart of any website. It represents a single record in the CMS system.
|
||||
|
||||
To make a call to the api simply use the $cms variable:
|
||||
|
||||
$page = $cms->key("OBJECT-NAME")->single();
|
||||
|
||||
Call a single record by ID
|
||||
|
||||
$cms->key(1234)->single();
|
||||
|
||||
Call a single record by slug
|
||||
|
||||
$cms->parent(key)->slug(about-us)->single();
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
Multiple objects represent a group of records in the CMS system.
|
||||
|
||||
To make a call to the api simply use the $cms variable:
|
||||
|
||||
$pages = $cms->key("OBJECT-NAME")->multiple();
|
||||
|
||||
You can also filter your results base field name.
|
||||
|
||||
$pages = $cms->key("OBJECT-NAME")->filter(FIELD-NAME, FIELD-VALUE)->multiple();
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
This helper was added to the connector.php file, version 2.*. It is designed to display a fully-functioning AJAX web form with validation built in.
|
||||
|
||||
```php
|
||||
<? if (isset($page['fields']['form'])) {
|
||||
$cms->formbuilder($page['fields']['form'], $page);
|
||||
}
|
||||
?>
|
||||
```
|
||||
|
||||
Returns: HTML/JS
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
{
|
||||
"title": "TodayCMS Documentation",
|
||||
"homepage": "/Getting_Started",
|
||||
"theme": "bootstrap",
|
||||
"hightlight": "none",
|
||||
"twitter": ["todaymade"],
|
||||
"links": {
|
||||
"Todaymade": "http://todaymade.com",
|
||||
"Help/Support": "http://todaymade.com/contact",
|
||||
"Submit a Bug": "https://github.com/justinwalsh/todaycms-docs/issues"
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue