Tessisamess: Layouts, Codes, & Resources

S	M	T	W	T	F	S
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28

Publication

Month Day, Year

Small Headline

Curabitur commodo, ipsum ut venenatis pharetra, ex enim sollicitudin magna, at elementum magna dolor eu nibh. Cras quis quam eleifend, porttitor purus vel, pharetra eros. Donec fringilla, est vitae sollicitudin efficitur, ligula elit porta orci, a posuere justo lectus nec felis. Quisque vitae convallis velit. Vivamus pulvinar turpis id ante ullamcorper dignissim. Aliquam elementum lorem sapien, nec facilisis purus aliquam vel. Nam nec quam diam. Sed finibus ligula quis ante molestie, vitae sollicitudin nulla sagittis.

Donec fringilla, est vitae sollicitudin efficitur, ligula elit porta orci, a posuere justo lectus nec felis. Quisque vitae convallis velit. Vivamus pulvinar turpis id ante ullamcorper dignissim. Aliquam elementum lorem sapien, nec facilisis purus aliquam vel.

Large Headline

Phasellus et pellentesque neque. Nam tristique arcu eget enim tincidunt pulvinar. Pellentesque nec risus sodales, tempus elit sit amet, rhoncus urna. Suspendisse accumsan orci id interdum varius. Praesent non metus vestibulum, ornare nisi at, scelerisque nisl. Duis vitae orci neque. Etiam volutpat diam ut nisl luctus pulvinar. Aliquam rutrum lacus in urna fermentum venenatis. Praesent nunc felis, laoreet sed placerat sit amet, lobortis vel purus. Morbi porttitor aliquet congue. Suspendisse commodo in quam porta feugiat. Nullam suscipit cursus erat, quis eleifend leo ullamcorper eget. Nullam tristique, magna sed mollis hendrerit, mauris mi bibendum nisi, vitae posuere orci mi sit amet eros. Donec feugiat malesuada elementum. Nulla consequat metus id felis viverra hendrerit. Integer eu lectus lacinia nisl faucibus luctus in semper eros.

Small Headline

Nulla non bibendum odio. In luctus, ipsum id condimentum placerat, sem tellus ultricies diam, id faucibus lorem sapien id tortor. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec et tempus mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque quis metus condimentum ligula dictum hendrerit quis vitae dui. Donec a malesuada purus, ac efficitur lorem. Etiam molestie nunc in purus vestibulum condimentum. Donec ut tristique erat, vitae accumsan felis.

Aenean id varius lorem. Sed et fringilla ipsum, et vehicula nibh. Aliquam erat volutpat. Curabitur commodo, ipsum ut venenatis pharetra, ex enim sollicitudin magna, at elementum magna dolor eu nibh. Cras quis quam eleifend, porttitor purus vel.

Medium Headline

Aenean id varius lorem. Sed et fringilla ipsum, et vehicula nibh. Aliquam erat volutpat. Curabitur commodo, ipsum ut venenatis pharetra, ex enim sollicitudin magna, at elementum magna dolor eu nibh. Cras quis quam eleifend, porttitor purus vel, pharetra eros. Donec fringilla, est vitae sollicitudin efficitur, ligula elit porta orci, a posuere justo lectus nec felis. Quisque vitae convallis velit. Vivamus pulvinar turpis id ante ullamcorper dignissim. Aliquam elementum lorem sapien, nec facilisis purus aliquam vel. Nam nec quam diam. Sed finibus ligula quis ante molestie, vitae sollicitudin nulla sagittis.

Small Headline

Ased et fringilla ipsum, et vehicula nibh. Aliquam erat volutpat. Curabitur commodo, ipsum ut venenatis pharetra, ex enim sollicitudin magna, at elementum magna dolor eu nibh. Cras quis quam eleifend, porttitor purus vel, pharetra eros. Donec fringilla, est vitae sollicitudin efficitur, ligula elit porta orci, a posuere justo lectus nec felis. Quisque vitae convallis velit. Vivamus pulvinar turpis id ante ullamcorper dignissim. Aliquam elementum lorem sapien, nec facilisis purus aliquam vel. Sed finibus ligula quis ante molestie, vitae sollicitudin nulla sagittis.

Pellentesque nec risus sodales, tempus elit sit amet, rhoncus urna. Suspendisse accumsan orci id interdum varius. Praesent non metus vestibulum, ornare nisi at, scelerisque nisl. Duis vitae orci neque. Etiam volutpat diam ut nisl luctus pulvinar. Aliquam rutrum lacus in urna fermentum venenatis. Praesent nunc felis, laoreet sed placerat sit amet, lobortis vel purus. Morbi porttitor aliquet congue. Suspendisse commodo in quam porta feugiat. Nullam suscipit cursus erat, quis eleifend leo ullamcorper eget. Nullam tristique, magna sed mollis hendrerit, mauris mi bibendum nisi, vitae posuere orci mi sit amet eros. Donec feugiat malesuada elementum. Nulla consequat metus id felis viverra hendrerit. Integer eu lectus lacinia nisl faucibus luctus in semper.

Large Headline

Small Headline

FOOTER INFO | SHORT NOTES | EXTRA CONTENT | CODING

Information

Hey guys! Today we have another mockup to add to the collection—a newspaper with multiple column arrangements that can be as long or short as you need it to be; perfect for in character news, or a fun way to present your mod announcements! Images automatically size themselves and filter to match the newspaper aesthetic, so you can copy/paste the demo image to any column in the paper to use it above any section you like, as many times as you like. Additionally, your paper texture and paper color are two separate elements, so you can recolor this newspaper's background without losing the paper texture! Enjoy! 💖

The Coding

<div style="width:100%;display:flex;align-items:flex-end;border-bottom:4px double rgba(0,0,0,0.8);line-height:1;padding:0 0 10px 0;margin:0 0 10px 0;">

<img src="https://i.imgur.com/v63PuiF.png" style="padding:0 8px 0 0;">

<div style="font-size:30px;">
			Publication
		</div>

<i style="margin:0 0 0 auto;letter-spacing:1px;font-weight:bold;font-size:10px;">
			Month Day, Year
		</i>

</div>

<div style="width:calc(25% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

3 COLUMN SMALL

</div>

<div style="width:calc(50% - 20px);margin:20px 0;">

<img src="ARTICLE_IMG" style="max-width:100%;filter:grayscale(100%);opacity:0.9;">

<div style="font-size:30px;">
			Large Headline
		</div>

3 COLUMN LARGE

</div>

<div style="width:calc(25% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

3 COLUMN SMALL

</div>

<div style="width:calc(50% - 20px);margin:20px 0;">

<div style="font-size:25px;">
			Medium Headline
		</div>

2 COLUMN EQUAL

</div>

<div style="width:calc(50% - 20px);margin:20px 0;">

<div style="font-size:25px;">
			Medium Headline
		</div>

2 COLUMN EQUAL

</div>

<div style="width:calc(33.3% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

2 COLUMN SMALL

</div>

<div style="width:calc(66.6% - 20px);margin:20px 0;">

<div style="font-size:30px;">
			Large Headline
		</div>

2 COLUMN LARGE

</div>

<div style="width:calc(33.3% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

3 COLUMN EQUAL

</div>

<div style="width:calc(33.3% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

3 COLUMN EQUAL

</div>

<div style="width:calc(33.3% - 20px);margin:20px 0;">

<div style="font-size:20px;">
			Small Headline
		</div>

3 COLUMN EQUAL

</div>

<div style="width:100%;border-top:4px double rgba(0,0,0,0.8);border-bottom:4px double rgba(0,0,0,0.8);padding:20px 0;margin:15px 0 0 0;text-align:center;line-height:1;letter-spacing:1px;font-size:10px;text-transform:uppercase;">

FOOTER INFO | 
		<a href="http://tessisamess.insanejournal.com/136258.html" style="color:#000;text-decoration:none;">CODING</a>

</div>

</div></div>

Editing Guide

Paste the coding into Notepad or similar and bring up Replace All (usually Ctrl+H) to replace values quickly and easily!

FONTS

georgia,serif - All text

IMAGES

https://i.imgur.com/2S7kZ8C.png - Paper texture
https://i.imgur.com/v63PuiF.png - Header icon logo

OTHER

4px double - Header & footer border

COLORS

#EDEDEB Container background

#111 All text

rgba(0,0,0,0.8) Header & footer border

Terms of Use

♡ Do not remove credit.
♡ Do not redistribute my codes in part or in whole (posting a copy for players to use in your game is fine with a link to original post.)
♡ If you break something during editing, please feel free to drop me a comment and I'll help as best I can!
♡ I love seeing edits! This isn't a rule, but if you have a cool edit of one of my codes I'd love to see it!

Using on DW?

Tessisamess

Layouts, Codes, Tutorials, & Resources

Hey there, I'm Tess!

Need an invite?

Navigation

Please Note:

Tags

Layout By

Profile

Hey there, I'm Tess!

Need an invite?

Navigation

February 2021

Please Note:

Tags

Layout By

Mockup: Newspaper

Information

The Coding

Editing Guide

Terms of Use

Comments