Solution for setting up header and footer in a template

Solution for setting up header and footer in a template

Hi all,

Emon need for business, I have long searched the forum and also how to put in my quote and my bills a header and a footer.
And finally, I have an other working stream elements allowing me to meet my needs ...

Given the number of people seeking the same thing as me, I say it might be good to share my discovery.

It's simple and easy to implement

First, start by adding the beginning of your HTML the following:

  1. <style>
  2. html {margin: 0;}
  3.  body {margin: 0;}
  4.  div # printhead {
  5. display: block;
  6.  position: fixed;
  7.  top: 0;
  8.  left: 0;
  9.  width: 100%;
  10. font-family: arial;
  11.  height: 2em;
  12. }
  13.   div # {fdiv
  14. position: fixed;
  15.    width: 100%;
  16.    bottom: 0;
  17.    left: 0;
  18.   text-align: right;
  19. font-family: arial;
  20. }
  21.  # ftrspan span {
  22. display: none;
  23. }
  24.   # pnoinftr span: after {
  25. counter-increment: Fpage0;
  26.   content: counter (Fpage0);
  27. }
  28.  div # {myCONTENT
  29. position: relative;
  30. top: 220;
  31. left: 0;
  32. width: 100%;
  33. height: 2em;
  34. font-family: arial;
  35. font-size: 12pt;
  36. color: black;
  37.  }
  38. div # {mymarge
  39. padding-left: 40pt; padding-right: 40pt; font-family: arial; font-size: 12pt; color: black;
  40.  }
  41. </ Style>



So here for an explanation:

  • div # header block corresponds to the printhead
  • div # fdiv corresponds to footer
  • # pnoinftr span: after correpsond numéroi to display the current page
  • div # myCONTENT correpsond to content


Just in the header, this element should be located immediately after the style elements defined above:

Mine correpsond this:

  1. <div id="printhead">
  2. <table border="0" width="100%" cellpadding="0" cellspacing="0">
  3. <tbody>
  4. <tr>
  5. <td width="100%" height="40pt" valign="top" colspan="2" style="background-color: rgb(53, 57, 68);">

  6. </ Td>
  7. </ Tr>
  8. <tr>
  9. <td width="70%" valign="middle" style="background-color: rgb(53, 57, 68);padding-left:40pt;">
  10. <img src="https://crm.zoho.com/crm/viewCompanyLogo?fileId=2569181000000018003&zgId=23830819" align="left">
  11. </ Td>
  12. <Td width = "30%" valign = "middle" style = "background-color: rgb (53, 57, 68), border-style: none none none solid; border-left-color: white; border-left- width: 1pt; padding-left: 10pt; color: white; font-size: 18pt ">
  13. <b> Organization.Organization $ {Name} </ b> </ br>
  14. <span style="font-size: 9pt;"> Organization.Street} $ {</ br> $ {Organization.Zip Code} $ {$ {} Organization.City Organization.Country} </ br>
  15. Tel: Organization.Phone} $ {</ span>
  16. </ Td>
  17. </ Tr>
  18. <tr>
  19. <td width="100%" height="10pt" valign="top" colspan="2" style="background-color: rgb(53, 57, 68);">
  20. </ Td>
  21. </ Tr>
  22. <tr>
  23. <td width="100%" height="10pt" valign="top" colspan="2" style="background-color: rgb(0,188,205);">
  24. </ Td>
  25. </ Tr>
  26. <tr>
  27. <td width="100%" valign="middle" colspan="2" style="background-color: rgb(0,188,205); padding-left:40pt;color:white;font-size: 30pt;">
  28. QUOTE No Quotes.Numéro $ {Quote}
  29. </ Td>
  30. </ Tr>
  31. <tr>
  32. <td width="100%" height="10pt" valign="top" colspan="2" style="background-color: rgb(0,188,205);">
  33. </ Td>
  34. </ Tr>
  35. </ Tbody>
  36. </ Table>
  37. </ Div>

I just put in my header the information that I wanted to appear on each page including:
  •  An image
  •  The name of my company
  •  Its address
  •  His phone
  •  The number of quotes
 
 Turn now to the footer, it should be placed in any end of your HTML file
 
 Mine is this:
 
  1. <div id="fdiv">
  2. <table border="0" width="100%" cellpadding="0" cellspacing="0">
  3. <tbody>
  4. <tr>
  5. <td width="100%" height="10pt" valign="top" colspan="3" style="background-color: rgb(0,188,205);">
  6. </ Td>
  7. </ Tr>
  8. <tr>
  9. <td width="30%" valign="top" style="background-color: rgb(0,188,205); padding-left:40pt;color:white;font-size: 9pt;">
  10. SARL with capital of € xxxxxxxxx </ br>
  11. SIREN: xxx xxx xxx </ br>
  12. EPA: xxxxx </ br>
  13. VAT: xxxxxxxx
  14. </ Td>
  15. <td width="50%" align="center" valign="top" style="background-color: rgb(0,188,205); padding-left:40pt;color:white;font-size: 9pt;">
  16. <span style="valign:top;"> A Group Company </ span>
  17. <img src="https://crm.zoho.com/crm/viewCompanyLogo?fileId=2569181000000018004&zgId=23830819" valign="top">
  18. </ Td>
  19. <td width="20%" align="right" valign="top" style="background-color: rgb(0,188,205); padding-right:40pt;color:white;font-size: 9pt;">
  20. $ {Quote} Quotes.Numéro Quote </ br>
  21. Page <span id="pnoinftr"> </ span>
  22. </ Td>
  23. </ Tr>
  24. <tr>
  25. <td width="100%" height="40pt" valign="top" colspan="3" style="background-color: rgb(0,188,205);">
  26. </ Td>
  27. </ Tr>
  28. </ Tbody>
  29. </ Table>
  30. </ Div>

I just put in my footer the information that I wanted to appear on each page including:
  • Legal Information
  • The name of the parent company
  • The number of quotes
  • The number ela current page
 
 Content for now to put between the header and footer, it makes sense but it costs nothing to be redefined.
 Attention, clarification, we will have a little play with the pages ie control your content.
 You'll probably spend a bit of time before this end, for my part, I have done so:
  •  First page:
    •  Customer Information
    •  Information on the estimate
    •  Information on the composition of the estimate
    •  Terms of payment
  •   2nd page:
    • Information on the parts
  •   3rd page:
    • Presentation of draft
  •   Fourth and following pages: 
    • Terms and Conditions
  
  
  The content of the first page will be found in the div and said:
  1. <div id="mycontent">
  2. Content of my first page
  3. </ Div>

The other pages will be found in the div which reads:
  1. <div id="mycontent" style="page-break-before: always;">
  2. Content of my second page
  3. </ Div>

Style = "page-break-before: always;" will allow you to skip a page before the contents of the div and therefore reproduce in this new web page header and your footer.


I hope I have been able to provide answers to this issue
Do not hesitate to get back to me if you encounter problems with the proposed solution

Here are just attached the complete HTML code of my quote ;)
    • Recent Topics

    • Zoho Books/Inventory - Update Marketplace Sales Order via API

      Hi everyone, Does anyone know if there is a way to update Sales Orders created from a marketplace intigration (Shopify in this case) via API? I'm trying to cover a scenario where an order is changed on the Shopify end and the changes must be reflected
    • Zoho Inventory / Finance Suite - Add feature to prevent duplicate values in Item Unit field

      I've noticed that a client has 2 values the same in the Unit field on edit/create Items. This surprised me as why would you have 2 units with the same name. Please consider adding a feature which prevents this as it seems to serve no purpose.
    • Kaizen #224 - Quote-driven Deal Reconciliation Using Zoho CRM Functions and Automation

      Hello everyone! Welcome back to another instalment in the Kaizen series. This post covers quote-driven deal reconciliation, emphasizing Functions and Automation to address practical sales challenges. Business Challenge Sales organizations often mark deals
    • BARCODE PICKLIST

      Hello! Does anyone know how the Picklist module works? I tried scanning the barcode using the UPC and EAN codes I added to the item, but it doesn’t work. Which barcode format does this module use for scanning?
    • Zoho Inventory - Allow Update of Marketplace Generated Sales Orders via API

      Hi Inventory Team, I was recently asked by a client to create an automation which updated a Zoho Inventory Sales Order if a Shopify Order was updated. I have created the script but I found that the request is blocked as the Sales Order was generated by
    • How do I create an update to the Cost Price from landed costs?

      Hi fellow Zoho Inventory battlers, I am new to Zoho inventory and was completely baffled to find that the cost price of products does not update when a new purchase order is received. The cost price is just made up numbers I start with when the product
    • VoC in Zoho CRM is now data savvy: Explore response drilldown, summary components and participation in CRM criteria

      VoC has all the goods when it comes to customer intelligence—which is why we're constantly enhancing it. We recently added the following: A customer drilldown component that shows you the list of prospects and customers behind a chart's attribute Expanded
    • Let’s Talk Recruit: LinkedIn Cheatsheet

      Welcome to the first edition of Let’s Talk Recruit for 2026. We are kicking off the year by revisiting one of the most asked about topics in Zoho Recruit. How our LinkedIn integrations actually work and how recruiters can get the most value from them.
    • Zoho Forms API

      Is there any way to get all form entry list using API? Looking forward to hear from you
    • Ability to Set Client Name During Portal Invitation

      Hi Zoho Team, We would like to suggest an important enhancement to the Zoho Creator Client Portal functionality. Zoho Creator recently introduced the option to set a client’s display name in the Client Portal settings, which is very helpful for creating
    • 【Zoho CRM】データ一覧画面でのメモのバッジ機能リリースのお知らせ

      ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。2026年度もゾーホーユーザーコミュニティをどうぞよろしくお願いいたします! 今回は「Zoho CRM アップデート情報」の中から、新機能のデータ一覧画面でのメモのバッジ機能をご紹介します。 目次 概要 メモのバッジ機能について メモの作成について メモに関する様々な処理について 最近追加したメモについて メモのバッジの非表示について クライアントスクリプトの対応 概要  メモのバッジ機能について 既存の活動バッジに加えて、すべてのタブのデータ一覧表示画面に、各データごとに利用できる「メモのバッジ」(キャプチャ内の赤枠部分)が新たに導入されました。
    • is it possible to add more than one Whatsapp Phone Number to be integrated to Zoho CRM?

      so I have successfully added one Whatsapp number like this from this User Interface it seems I can't add a new Whatsapp Number. I need to add a new Whatsapp Number so I can control the lead assignment if a chat sent to Whatsapp Phone Number 1 then assign
    • Can’t find fsm in zoho one

      Every other app is available to me in Zoho one except fsm
    • Posibility to add Emoticons on the Email Subject of Templates

      Hi I´ve tried to add Emoticons on the Subject line of Email templates, the emoticon image does show up before saving the template or if I add the Emoticon while sending an Individual email and placing it manually on the subject line. Emoticons also show
    • Task Deletion Restriction & Strict Stage Control

      Hello Zoho Community, We have the following two issues currently pending and under testing, for which we require a workable and reliable solution: 1. Task Deletion Restriction We are testing ways to ensure that staff users are not able to delete tasks
    • Unable to mass update a picklist field

      Hello, I have the records within our Accounts module divided between two account types: Parent Accounts & Member Accounts. I am attempting to mass update accounts from one picklist value to the other (within other specific criteria in our custom fields)
    • Process checklist in CRM

      Hi We've created a new sales process that I'm mapping into the CRM - issue I have is that some of the tasks / milestones I would like to capture require very simple tick box responses but there are quite a few under a variety of sub categories so I don't
    • CRM project association via deluge

      I have created a workflow in my Zoho CRM for closing a deal. Part of this workflow leverages a deluge script to create a project for our delivery team. Creating the project works great however, after or during the project creation, I would like to associate
    • Where is the settings option in zoho writer?

      hi, my zoho writer on windows has menu fonts too large. where do i find the settings to change this option? my screen resolution is correct and other apps/softwares in windows have no issues. regards
    • This user is not allowed to add in Zoho. Please contact support-as@zohocorp.com for further details

      Hi Team, when I,m trying to create a email account (imagixmidia.com.br) it's showing this error >>  This user is not allowed to add in Zoho. Please contact support-as@zohocorp.com for further details plz help me  thanks
    • How to manage task lists in Zoho Desk?

      Hello, I use Zoho Desk for IT customer support. I have a list of standard operating procedures (SOPs), including SOPs for onboarding new users, offboarding users, losing a device, etc. These are lists of tasks to be performed depending on the situation.
    • Zoho Books' 2025 Wrapped

      Before we turn the page to a new year, it’s time to revisit the updates that made financial management simpler and more intuitive. This annual roundup brings together the most impactful features and enhancements we delivered in 2025, offering a clear
    • Activating Zobot instead of chat

      Hi folks, I know this will be obvious, but I have not been able to locate the details on this via google or youtube. We've had SalesIQ life chat set up for a while now and it is working perfectly. I have just finished development of a Zobot (using codeless)
    • Adding a new section to the related details sidebar when creating a new ticket.

      Hello, I was wondering if you can add a new section to the related details sidebar when creating a new ticket. I was wanting to have it to where it also shows the account information related to the contact chosen as well. This is the section I am referring
    • Displaying only unread tickets in ticket view

      Hello, I was wondering if someone might be able to help me with this one. We use filters to display our ticket list, typically using a saved filter which displays the tickets which are overdue or due today. What I'd really like is another filter that
    • Is Zoho Shifts included in the Zoho One plan?

      In case the answer is no: there's any plan to make it available via One? Thank you
    • Zoho Tracking Image location

      So we've been having an issue with tracking email opens. Specifically in Gmail. Our emails are not that long either, maybe 4 sections of image/250 characters of text/button per section.  But all my test accounts I used via Gmail we're showing opens. But then come to find out the tracking image is at the very bottom of the email. So If the message is clipped (It always just clips our social icons on the bottom) and the user doesn't click the show more button it never tracks the open.  Looking at other
    • Creating an invoice to be paid in two installments?

      Hi there, I own a small Photographic Services business and have not been able to find a way to fit my billing system into Zoho, or any other Accounting software. The way my payments work is: 1. Customer pays 50% of total price of service to secure their
    • Zoho Tables is now live in Australia & New Zealand!

      Hey everyone! We’ve got some great news to share — Zoho Tables is now officially available in the Australian Data Center serving users across Australia and New Zealand regions! Yes, it took us a bit longer to get here, but this version of Zoho Tables
    • Delivery and handling of documents e-stamped using Zoho Sign

      Hello everyone! Zoho Sign makes it easy to pay non judicial stamp duty online and automatically attach the digitally generated e-stamp challan to electronic documents. We also manage the delivery of physical e-stamped papers. We periodically receive these
    • Introducing Dedicated Modules for Plans, Addons, and Coupons in Zoho Billing

      We’ve enhanced the way you manage Plans, Addons, and Coupons in Zoho Billing. Previously, all three grouped together under Subscription Items. Now, each one has its own dedicated module, giving you a cleaner and more intuitive experience. This update
    • Sortie de Zoho TABLE ??

      Bonjour, Depuis bientôt 2 ans l'application zoho table est sortie en dehors de l'UE ? Depuis un an elle est annoncée en Europe Mais en vrai, c'est pour quand exactement ??
    • Drop Down Value

      Hi, May I know why Zoho Flow treat this drop down as number and not as string. If so, how can I fetch the right value for filtering. This field is from Creator, in Creator upon checking by default it is a string since it's not a lookup field.
    • Zoho CRM's mobile apps: A 2025 Recap

      2025 marked a year of steady progress for Zoho CRM's mobile apps. We rolled out several updates and features to improve usability and make everyday CRM work a lot easier to manage. Here’s a look back at some of the key releases from 2025. Android releases
    • Facebook follower count doesn't match FB Analytics

      Hi all, I am wondering if anyone else has issues with follower counts for Facebook not matching FB's native analytics tool. On the Zoho dashboard, it's showing 1,007, but FB shows 1,060. All the other channels match up. Any insights are much appreciated!
    • Meta and Facebook data report discrepancy

      I have been currently gathering manually facebook follower data thru meta. In zoho marketing plus the social media reporting only allows for page likes, and so there is a discrepancy with the data. please the difference in files attached. Is there way
    • Unlocking New Levels: Zoho Payroll's Journey in 2025

      Every year brings its own set of challenges and opportunities to rethink how payroll works across regulations and teams. In 2025, Zoho Payroll continued to evolve with one clear focus: giving businesses more flexibility, clarity, and control as they grow.
    • Can I export all attachments from Zoho CRM?

      Can I export all attachments from Zoho CRM?
    • Community Digest — Noviembre y Diciembre 2025

      ¡Hola, Comunidad de Zoho en Español! Cerramos el año de la mejor forma con nuestro último Community Digest de 2025, donde podrás encontrar las últimas novedades de nuestros productos. ¿Todo listo para empezar 2026 con el mejor pie? ¡Vamos a ello! Zoho
    • Zoho Projects Plus’ 2025- the year we launched

      We’ve been building project management tools for the past 19 years, and a question we often hear is: Different teams in our organization prefer different project management methods; while the development team prefers agile, the marketing and sales teams
    • Next Page