Embedded Archive: Customizing its Appearance

CTCT Employee

Hi. I am a part of the team that created the Embeddable Archive feature and we are really excited about the product and the opportunity it gives our customers to customize their Archive list to appear directly on their own web pages. Since launching this product, we have had some feedback that our customers would like to customize the appearance of that list, so we are providing a few examples to show how to make a few different appearance customizations.

In all of these examples, please be sure to replace my archive code snippet with your own snippet! Otherwise your site will just be displaying my own archived emails, which you definitely don’t want. (Reminder: I’m referring to the HTML snippet you get when you go to your “My Campaigns” page and click the gear next to “Archived Campaigns”, take a look here if you need some help finding it.)

Basically what these examples are doing are styling the appearance of the Archive list by preceding the html code snippet with a <style></style> section. Please note that these styles might not cooperate with the existing styles on your website, so please closely examine your page to make sure it still looks exactly the way you want after trying out these changes.

 

1. To make your list bulleted, with hollow circles for bullets:

<style>
       #archiveList > ul {
          list-style-type: circle;
          list-style-position: inside;
        }
</style>
<!--Begin CTCT Archive-->
<script id="archiveScript" src="//static.ctctcdn.com/js/archive-static/current/archive-static.min.js"></script> <div id="archiveList" data-archive-count="10" data-m="a07ea78e8ui0"></div>
<!--End CTCT Archive-->

Tip: There are many different bullet types you can use by changing the value of "circle". Choices include "square", "disc" (filled in circle), "decimal" (numbered list).

 

2. To increase line height to create more space between the list items:

<style>
        #archiveList {
          line-height: 2;
        }
</style>
<!--Begin CTCT Archive-->
<script id="archiveScript" src="//static.ctctcdn.com/js/archive-static/current/archive-static.min.js"></script> <div id="archiveList" data-archive-count="10" data-m="a07ea78e8ui0"></div>
<!--End CTCT Archive-->

Tip: Change the value of "line-height" to any number besides 2.

 

3. To change the color of the links to black:

 

<style>
        #archiveList a {
          color: #000000;
        }
      </style>
<!--Begin CTCT Archive-->
<script id="archiveScript" src="//static.ctctcdn.com/js/archive-static/current/archive-static.min.js"></script> <div id="archiveList" data-archive-count="10" data-m="a07ea78e8ui0"></div>
<!--End CTCT Archive-->

Tip: Want a color other than black? Replace the Hex value (#000000) with any color of your choice! More: HTML Color Picker - W3 Schools

 

4. To combine all of the previous three style change (this is just to demonstrate that you can combine multiple stylings as desired):

<style>
        #archiveList {
          line-height: 2;
        }
        #archiveList > ul {
          list-style-type: circle;
          list-style-position: inside;
        }
        #archiveList a {
          color: #000000;
        }
</style>

If you have any questions, feel free to reply in the comments below. You can also post any support questions in our forums here, or send us your feedback about the new archive feature.

46 Comments
Moderator

Hello @Old_Lutheran,

 

The archive feature is set up to display campaigns based on when they were archived, not when it was originally sent. 

 

Currently, the only way to re-organize it is to:

 

1. Unarchive the affected campaigns.

 

2. Make copies of the campaigns and send them to a list with just your e-mail address on it.

 

3. Once in Sent status, re-archive them based on the order you wanted them to display.

 

I apologize for any inconvenience this causes and I will make sure your feedback is tracked with our product teams.

Occasional Contributor

Have to say, I am not liking this new archive format at all!  I want my options back!  I only want E-news to show up on my public archive list, but i still want to archive other types of emails we send out.  I just don't want them to show up on the website!  Also, you REALLY need to let us order the emails how we want, AND choose how they display in terms of the title/description.  Please give us back control of these features!

Moderator

Hello @DebbieA21450,

 

I appreciate you posting your feedback and expressing your concerns with the new Archive feature. I can understand why some of the features you listed would be helpful. I will make sure this information is tracked in your account and passed to the appropriate department. 

 

I also recommend checking out our Feedback page and posting more of your ideas or concerns so other customers can comment and add to them.

We have three different email newsletters, each covering a different topic. I would like to post an archive of each newsletter on a different page of our website related to that topic.

 

Is it possible to do this?  Currently, we create all three newsletters in the same campaign. If I create a separate campaign for each topic, will each campaign have its own Archive code that I can paste to different pages on our website?

 

Thank you.

CTCT Employee

Hello @EnviroEditor,

 

Great question. The embeddable archive code with link to all archived emails, of which you can choose to display the most recent 5-100 emails. If you are looking to archive specific newsletters on your website, I would recommend using the "Short URL" attached to your sent email. This is a permalink that is essentially the same link the archive would generate for your emails, but would allow you to just have a link for just that one email; or any other emails you get the short URLs for. If you are looking to feature a specific newsletter, I would definitely put it in its own campaign. I hope this helps.

 

short_url.png

 

CTCT Employee

Hi @Old_Lutheran,

 

Thanks for your feedback! We are actively tracking customer requests for additional options to the archive. Please feel free to post your sorting idea in our feedback area here in the Community. You can also email us directly at social_support(at)constantcontact(dot)com so that we can track this for you. Please include the username for your account, a reference to this post, and the details of your idea. Thanks!

JSeth
Not applicable

At the request of the person who creates the newsletter, I have placed the code into a webpage on our webist, and it displays "News from Eastern Center for Arts and Technology" 12 times. Is there something that she needs to do so that the titles of the items in the archive will reflect something useful, such as the date of the news letter? Is there any coding that I could add which will extract something from the newsletter instead of the "News from Eastern Center for Arts and Technology". Thank you.

CTCT Employee

Hello @JSeth,

 

With the embeddable archive, the links will display with whatever text was used as the subject line. The easiest way to fix this, would be to make copies of those sent emails, change the subject line, and send them to a list with just you in it. After that, you can archive the new emails and post the code on your website. I hope this helps.

Is there a way to display an archive depending on which Folder you've placed the email in or is it that once you archive an email is it not found in a Folder any longer?  My issue is that I have multiple categories of emails that are sent out and I don't want to just lump them all in one archive.  That just doesn't help our recipients.  Is there a way to categorize the archive so to speak?

CTCT Employee

Hi, @HeatherL7975. Unfortunately there is not currently any way to categorize or segment your archive list when displaying it via the Embeddable Archive feature.

Member

It would also be nice to be able to configure more of the display options. Currently, it seems to show the email subject line. I would like the option to not only sort by the sent date, but also display the sent date. I might want to show the Campaign name rather than the subject line. Also - what about being able to create seperate archives for seperate lists? We currently have 3 distinct newsletters that we send, and Iwould like to display them in their own embedable feeds, distinct from one another. 

CTCT Employee

Hi @TeresaH2321,

 

Thanks so much for your feedback and we will definitely pass this along to our developers! Because the embeddable archive code links to all archived emails at this time, you could instead use the Short URL for your email campaigns:

 

2017-02-10_14-52-55.png

 

This would give you the flexibility to create and customize the three separate lists/feeds that you need. I hope this helps!

Visitor

Is there any update on the ability to sort the widget by date sent?  They're popping up in random order, and it would be lovely to have the most recent appear at the top of the page. 

Administrator

Hello @AdamA74. We do not have an update on this feature being added to the Archive. Our Product team is still collecting and looking into feedback, which I have submitted for you. You can also voice your feedback on our Feedback board here

 

I did want to let you know that the emails display in the order in which they were archived. You can manually change the order by unarchiving your emails, clicking Actions > Archive and make sure the action completes before moving on to archive the next email. I do apologize that this is a manual process right now but I did want to give you this workaround. 

How do you make the archive list go from newest to oldest? Right now they show up in the order that you archived them. 

Also...why is it the subject line and not the campaign title. The archive is so badly formatted. I wish you kept the old one.

Administrator

Hi @NICCommunications. Thanks for the questions. You are correct that the archive does appear in the order that you archived the campaign. At this time, we are not able to change the order of the archive. Also, the Archive does show the subject line since this is what appears in the inbox. I will submit your feedback to our Product team regarding this request to edit this information. 

Occasional Visitor

Does this code work in wordpress.  I posted it on a page but it does not appear.  

<style>
#archiveList > ul {
list-style-type: circle;
list-style-position: inside;
}
</style>
<!--Begin CTCT Archive-->
<script id="archiveScript" src="//static.ctctcdn.com/js/archive-static/current/archive-static.min.js"></script> <div id="archiveList" data-archive-count="10" data-m="a07ef1kr0ww0"></div>
<!--End CTCT Archive-->

Moderator

Hi @UUH

 

That's actually a great question! Since that code is javascript, this code working depends on the Wordpress platform you're using. From my understanding, wordpress.com sites don't support javascript and wordpress.org sites do. Because of this I would suggest speaking to your hosting company about if you can put a piece of javascript code on your site.

 

SueatNAMC
Not applicable

Help! Very frustrating to not be able to change the sequence of archived emails, and also the change to listing emails by subject line. So far I've gone in, deleted all previously archived newsletters, copied each one, changed the subject line, sent the new newsletter to myself, then marked for archive. Then waited for several hours (NOT 15 minutes.) to see how they show up on my website. For some reason, even though I was careful to archive in the order I wanted the items to display, they are displayed out of order. I've deleted all and started over 4 times so far.

 

I see that people have been complaining about this for over two years. Any progress on fixing this?