Documentation - Subscribe

Subscribe is simple feature but very powerful for static bloggers who don't have the time to setup newsletter. A simple form will display in your website and your user can subscribe to your blog.

As soon as you have publish the new article blogstreak subscribe will pick it up and send an nicely formatted email to all the newsletter subscribers.

Note: Place the script tags inside your head tag. And component tag where you want to display the subscribe form.


<script src="" type="module"></script> <blogstreak-subscribe></blogstreak-subscribe>


Attributes Explanation

To display blog name inside the subscribe form.


Since blogstreak subscribe created using web component. It adapts the CSS custom proeprties method to change the styling.

To change the each individual block you can refere the below table.

Variable Default Description
--subscribe-background-color #ffffff To change the whole background of subscribe section
--subscribe-margin o auto Center all the subscribe section
--subscribe-padding 1rem A nice padding for the section content
--subscribe-border 1px solid rgba(35, 28, 51, 0.15) Border to elevate the subscribe form.
--subscribe-border-radius 0.2em A nice corner for the subscribe form.
--subscribe-box-shadow 5px 5px 7px rgba(226, 221, 215, 0.5) Display shadow under the subscribe box.
--subscribe-label-color #363636 Change the subscribe label color
--subscribe-label-font-weight bold Change the subscribe label subscribe weight
--subscribe-input-padding 0.65em 1em
--subscribe-input-margin 0
--subscribe-input-background white
--subscribe-input-border 1px solid rgba(35, 28, 51, 0.15)
--subscribe-input-border-right-color transparent
--subscribe-input-border-radius 1.5em 0 0 1.5em
--subscribe-input-weight 100%
--subscribe-input-font-size 1rem
--subscribe-button-color black
--subscribe-button-background rgba(226, 221, 215, 0.4)
--subscribe-button-padding 0.5em 1em
--subscribe-button-border 1px solid rgba(35, 28, 51, 0.15)
--subscribe-button-border-left-color transparent
--subscribe-button-border-radius 0 1.5em 1.5em 0
--subscribe-button-cursor pointer

A hosted component library for your static blog.

© Copyright 2021 Blogstreak.