Announcement

Collapse
No announcement yet.

create email subscription box in the header

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • create email subscription box in the header

    Hi guys
    I've tried this code to create e-mail subscription in the header; between the logo and the social media buttons.

    <form action='mailto:youremail@youremail.com' method='post'> <input type='submit' value='Send Email'/> </form>

    unfortunately, it did not work the way I want. Here's how it looks after I wrote the code:
    Click image for larger version

Name:	it is.png
Views:	1
Size:	3.5 KB
ID:	1443112

    from the image above, you can see that the code for email subscription made the social media button almost disappeared.

    I want to the header looks like this image:

    Click image for larger version

Name:	I want.jpg
Views:	1
Size:	21.3 KB
ID:	1443113


    help me please

  • #2
    Hi there happydz,

    we really need to see a link to the site in question or your actual coding.



    ~ the original bald headed old fart ~

    Comment


    • #3
      Originally posted by coothead View Post
      Hi there happydz,

      we really need to see a link to the site in question or your actual coding.

      thank you
      I can make you admin to my site so that you can modify the code easily.
      I want to sent you the access information in private message but I don't know how.

      Comment


      • #4
        Hi there happydz,

        you may find the attachment helpful.
        Attached Files


        ~ the original bald headed old fart ~

        Comment


        • #5
          Originally posted by coothead View Post
          Hi there happydz,

          you may find the attachment helpful.
          Hi Mr coothead
          can you tell me how can I send you a message privately, because I want to send you the whole code of my blog, please

          Comment


          • #6
            Hi there happydz,

            the attachment code, that I posted, fully replicates the
            image that you provided to display your requirements.

            So I don't really need to see the code that you used
            in your attempt at making it.


            ~ the original bald headed old fart ~

            Comment


            • #7
              Thank you Mr Coothead
              I tried my best to put the logo along a side (side by side) with the description, but unfortualety I failed.

              here's the code:
              PHP Code:
              <!-- Header Wrap -->
              <
              div id='header-wrapper'>
              <
              div class='top-header row'>
              <!-- 
              Logo Site -->
              <
              b:section class='the-logo' id='header' maxwidgets='1' name='LOGO' showaddelement='yes'>
              <
              b:widget id='Header1' locked='true' title='The Global (Header)' type='Header' version='1' visible='true'>
              <
              b:includable id='main'>

              <
              b:if cond='data:useImage'>
              <
              b:if cond='data:imagePlacement == &quot;BEHIND&quot;'>
              <!--
              Show image as background to textYou can't really calculate the width
              reliably in JS because margins are not taken into account by any of
              clientWidth, offsetWidth or scrollWidth, so we don'
              t force a minimum
              width 
              if the user is using shrink to fit.
              This results in a margin-width's worth of pixels being cropped. If the
              user is not using shrink to fit then we expand the header.
              -->
              <b:if cond='
              data:mobile'>
              <div id='
              header-inner'>
              <div class='
              titlewrapper' style='backgroundtransparent'>
              <h1 class='
              title' style='backgroundtransparentborder-width0px'>
              <b:include name='
              title'/>
              </h1>
              </div>
              <b:include name='
              description'/>
              </div>
              <b:else/>
              <div expr:style='
              &quot;background-imageurl(\&quot;&quot; + data:sourceUrl + &quot;\&quot; &quot; + &quot;background-position: &quot; + data:backgroundPositionStyleStr + &quot;; &quot; + data:widthStyleStr + &quot;min-height: &quot; + data:height + &quot;_height: &quot; + data:height + &quot;background-repeatno-repeat; &quot;' id='header-inner'>
              <div class='
              titlewrapper' style='backgroundtransparent'>
              <h1 class='
              title' style='backgroundtransparentborder-width0px'>
              <b:include name='
              title'/>
              </h1>
              </div>
              <b:include name='
              description'/>
              </div>
              </b:if>
              <b:else/>
              <!--Show the image only-->
              <div id='
              header-inner'>
              <a expr:href='
              data:blog.homepageUrl' itemprop='url' style='displayblock'>
              <h1><img expr:alt='
              data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='displayblock'/></h1>
              </a>
              <!--Show the description-->
              <b:if cond='
              data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>
              <b:include name='
              description'/>
              </b:if>
              </div>
              </b:if>
              <b:else/>
              <!--No header image -->
              <div id='
              header-inner'>
              <div class='
              titlewrapper'>
              <h1 class='
              title'>
              <span itemprop='
              name'><a expr:href='data:blog.homepageUrl' itemprop='url'><b:include name='title'/></a></span>
              </h1>
              </div>
              <b:include name='
              description'/>
              </div>
              </b:if>
              </b:includable>
              <b:includable id='
              description'>
              <div class='
              descriptionwrapper'>
              <p class='
              description'><span><data:description/></span></p>
              </div>
              </b:includable>
              <b:includable id='
              title'>
              <b:if cond='
              data:blog.url == data:blog.homepageUrl'>
              <data:title/>
              <b:else/>
              <a expr:href='
              data:blog.homepageUrl'><data:title/></a>
              </b:if>
              </b:includable>
              </b:widget>
              </b:section>
              <!-- Logo Site (End) --> 
              I want the work result looks like this image, please

              Click image for larger version

Name:	large.png
Views:	1
Size:	11.1 KB
ID:	1443121



              Last edited by Pegasus; 10-03-2016, 06:59 AM.

              Comment


              • #8
                .............
                Last edited by happydz; 09-30-2016, 05:04 PM.

                Comment


                • #9
                  Hi there happydz.

                  I can code the example image that you posted, but I will need the image that you have for the bird's head.

                  Pleas attach it to your next post.

                  As for blogger code, I am happy to say that it is not my department. :


                  ~ the original bald headed old fart ~

                  Comment


                  • #10
                    Originally posted by coothead View Post
                    Hi there happydz.

                    I can code the example image that you posted, but I will need the image that you have for the bird's head.

                    Pleas attach it to your next post.

                    As for blogger code, I am happy to say that it is not my department. :
                    Hi Mr Coothead
                    here's the logo

                    Click image for larger version

Name:	logo-no-text.png
Views:	1
Size:	5.0 KB
ID:	1443125

                    Comment


                    • #11
                      Originally posted by coothead View Post
                      Hi there happydz.

                      I can code the example image that you posted, but I will need the image that you have for the bird's head.

                      Pleas attach it to your next post.

                      As for blogger code, I am happy to say that it is not my department. :
                      Hi Mr Coothead
                      here's the logo

                      Click image for larger version

Name:	logo-no-text --blue.png
Views:	1
Size:	6.3 KB
ID:	1443127

                      Comment


                      • #12
                        Hi there happydz,

                        check out the attachment.
                        Attached Files


                        ~ the original bald headed old fart ~

                        Comment

                        Working...
                        X