{
  "Status": true,
  "Message": "",
  "Response": {
    "post": {
      "postuid": "j9so9n53sc",
      "tenantuid": "d8b744fc-2e70-4089-bb80-dd1d08f6c7b2",
      "projectuid": "239698c5-f7eb-4574-8cc8-c6568f08b3a0",
      "title": "Editing a Landing Page\u0027s HTML and CSS",
      "slug": "article/j9so9n53sc-editing-a-landing-page-s-html-and-css",
      "html": "\u003Cp\u003EThe Page Designer generates HTML friendly emails based on the Bootstrap templates - these are optimized all major browsers and are mobile (responsive/adaptive) friendly.\u003C/p\u003E\u003Ch4\u003EHTML and CSS Editor\u003C/h4\u003E\u003Cp\u003EWhile DailyStory\u0026#39;s Pages Designer enables you to quickly build robust page, more complicated page designs typically start from an HTML base.\u003C/p\u003E\u003Cp\u003EAs an example, if you have an existing landing page design you wish to use in DailyStory the best way to start is to copy-and-paste the HTML and CSS of that landing page into a new DailyStory page\u0026#39;s HTML and CSS.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-04.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003EPages HTML Editor\u003C/figcaption\u003E\u003C/figure\u003E\u003Cp\u003EEditing the HTML of an email is an advanced option. And, emails built with the Email Designer will initially prevent you from editing the email:\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/emails/emails-20.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003EEmail HTML Locked\u003C/figcaption\u003E\u003C/figure\u003E\u003Cp\u003EHowever, you can always click \u0026#34;Unlock HTML Editor\u0026#34; to edit the HTML.\u003C/p\u003E\u003Cp\u003EEditing the HTML of an email built with the designer may cause the designer to no longer recognize widgets added with the designer.\u003C/p\u003E\u003Ch3\u003EEditing CSS\u003C/h3\u003E\u003Cp\u003EWhile editing the HTML of an email built with the designer is not recommended, the CSS of an email may be editing with no impact to the designer.\u003C/p\u003E\u003Cp\u003ESimply click the CSS tab and edit/modify CSS rules for your email.\u003C/p\u003E\u003Cp\u003E\u003Cb\u003EImportant\u003C/b\u003E\u0026#160;when DailyStory sends your email it merges all the CSS and HTML together. The full CSS is always included in a \u0026lt;style\u0026gt; tag of the HTML body of your email, but DailyStory will also attempt to inline the CSS rules as well. You can preview and email and view the source to see what the fully merged HTML of the email will look like.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-05.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003EContent editor\u003C/figcaption\u003E\u003C/figure\u003E\u003Col\u003E\u003Cli\u003ESave and publish\u003C/li\u003E\u003C/ol\u003E\u003Cp\u003ESave the page and click on the permalink at the top to open it in a new browser window.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-06.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003EPublished page\u003C/figcaption\u003E\u003C/figure\u003E\u003Cp\u003EThe page automatically includes the \u003Ca href=\u0022/article/ppg0z9xv1v-installing-the-daily-story-tracking-tag\u0022\u003EDailyStory Beacon\u003C/a\u003E\u0026#160;and Google Analytics (if configured).\u003C/p\u003E\u003Ch2\u003EAdvanced Page Configuration\u003C/h2\u003E\u003Cp\u003EIn addition to creating a basic page using the WYSIWYG editor, you can also edit HTML and add custom CSS and JavaScript.\u003C/p\u003E\u003Ch3\u003EEdit Page HTML\u003C/h3\u003E\u003Cp\u003ETo edit the HTML of you page, click the HTML tab.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-07.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003EEdit page HTML\u003C/figcaption\u003E\u003C/figure\u003E\u003Cp\u003EThe HTML content is automatically inserted in the \u003Cbody/\u003E of the page.\u003C/p\u003E\u003Ch3\u003ECustom Head Content\u003C/h3\u003E\u003Cp\u003EIf you want to add style sheets, additional meta tags, JavaScript libraries or other content you can add the HTML in the Custom Headers section.\u003C/p\u003E\u003Cp\u003EFor example, if you want to use the Bootstrap Framework for building responsive mobile pages in DailyStory, just add the Bootstrap files.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-08.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003ECustomize page headers\u003C/figcaption\u003E\u003C/figure\u003E\u003Cp\u003ENow Bootstrap\u0026#39;s CSS rules update how our page is displayed.\u003C/p\u003E\u003Ch3\u003ESet Custom CSS Rules\u003C/h3\u003E\u003Cp\u003EYou can add your own style sheet rules to the page by entering CSS in the Custom CSS editor.\u003C/p\u003E\u003Cp\u003EFor example, to set the font size of the \u0026lt;h1\u0026gt; tag.\u003C/p\u003E\u003Cfigure\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://dailystory-docs.azurewebsites.net/articles/pages/pages-09.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cfigcaption\u003ECustomize page styles\u003C/figcaption\u003E\u003C/figure\u003E\u003Ch4\u003EOther Resources\u003C/h4\u003E\u003Cul\u003E\u003Cli\u003E\u003Ca href=\u0022/article/o5cuusbxt9-creating-or-editing-a-landing-page\u0022\u003ECreate or Edit a Landing Page\u003C/a\u003E\u003C/li\u003E\u003Cli\u003E\u003Ca href=\u0022/article/922m6dlbdu-assigning-a-form-to-a-landing-page\u0022\u003EAdd a Form to a Landing Page\u003C/a\u003E\u003C/li\u003E\u003Cli\u003E\u003Ca href=\u0022/article/dcbmnnuxxa-landing-page-frequently-asked-questions\u0022\u003EFrequent Asked Questions\u003C/a\u003E about Landing Pages\u003C/li\u003E\u003C/ul\u003E",
      "publish_status": 0,
      "post_type": "Article",
      "featured_image_updating": false,
      "meta_description": "The Page Designer generates HTML friendly emails based on the Bootstrap templates - these are optimized all major browsers and are mobile (responsive/adaptive) friendly. HTML and CSS Editor While DailyStory\u0026#39;s Pages Designer enables you to quickly build robust page, more complicated page designs typically start from an HTML base. As an example, if you have an existing landing page design you wish to use in DailyStory the best way to start is to copy-and-paste the HTML and CSS of that land ...",
      "display_toc": true,
      "has_workingcopy": false,
      "allow_indexing": true,
      "total_views": 1077,
      "date_published": "2022-06-16T14:33:34",
      "date_updated": "2025-05-16T19:14:11.667",
      "date_created": "2025-04-24T15:02:12.1"
    }
  }
}