Estrella Design — Your Source for Wordpress, Coppermine, Twitter and Facebook Graphics

Orders Are Not Accepting

Estrella Design

Your Source for Wordpress, Coppermine, Twitter and Facebook Graphics

Welcome Message

Welcome to Estrella Design, your source for graphic designs. Thanks to our source, you can order any theme for your sites based on Wordpress and Coppermine, and any layout for fan accounts on such social networks like Twitter, and Facebook. Also, we offer you simple plugins, premades, and code snippets we regularly add to the site. We usually complete your orders as soon as possible and do our best to make you happy with the result. If you have some questions, send us an email at any time, and we will answer all your questions you care about. To us, giving you the best stuff is very important to us. Remember that we are only offering support for the works that are made by us. We hope you are loving our work and would come back to order a new theme or get much more.

Lots of love, the Estrella Design Team.

Search The Web

Type anything and press Enter to start searching...

Uncategorized

Code Snippets

Admin May, 26 2021 X 871 views 7 likes

Many webmasters love using beautiful codes for their sites and make them different. But if you are a beginner and just learn to work with HTML and CSS coding, you do not know what to do to make your site and posts look beautiful. For this case, I made some simple codes, which you may use on your site absolutely for free. You need only to copy any code you want and change it by adding some content. I will be using mainfully HTML codes (foundation) + CSS codes (styling). Maybe, some of the codes will consist PHP coding. If you are non-experiened in coding, you can change nothing and just copy/paste tags you need. But if you have some knownledge, you can customize my codes in any way you want.

Tour Date #1

HTML + CSS Code Preview:

Jan 01 2020

Tour Place Tour City

Buy Tickets

Jan 01 2020

Tour Place Tour City

Finished Show

Jan 01 2020

Tour Place Tour City

Soldout Show

HTML Code: <div class="tour_dates_all">
<div class="tour_dates_block">
<table class="tour_dates_table">
<tr>
<td class="tour_dates_cell" id="date" width="15%">
<span>Jan</span>
<span>01</span>
<span>2020</span>
</td>
<td class="tour_dates_cell" id="place_city" width="auto">
<span class="tour_dates_place">Tour Place</span>
<span class="tour_dates_city">Tour City</span>
</td>
<td class="tour_dates_cell" id="tickets" width="80">
<span><a href="#" title="">Buy Tickets</a></span>
</td>
</tr>
</table>
</div>

<div class="tour_dates_block completed">
<table class="tour_dates_table">
<tr>
<td class="tour_dates_cell" id="date" width="15%">
<span>Jan</span>
<span>01</span>
<span>2020</span>
</td>
<td class="tour_dates_cell" id="place_city" width="auto">
<span class="tour_dates_place">Tour Place</span>
<span class="tour_dates_city">Tour City</span>
</td>
<td class="tour_dates_cell" id="tickets" width="80">
<span class="tour_dates_completed">Finished Show</span>
</td>
</tr>
</table>
</div>

<div class="tour_dates_block soldout">
<table class="tour_dates_table">
<tr>
<td class="tour_dates_cell" id="date" width="15%">
<span>Jan</span>
<span>01</span>
<span>2020</span>
</td>
<td class="tour_dates_cell" id="place_city" width="auto">
<span class="tour_dates_place">Tour Place</span>
<span class="tour_dates_city">Tour City</span>
</td>
<td class="tour_dates_cell" id="tickets" width="80">
<span class="tour_dates_soldout">Soldout Show</span>
</td>
</tr>
</table>
</div>

</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .tour_dates_all {color: white;padding: 10px 0 10px 0;}
.tour_dates_table {width:100%;border:none;border-spacing:0px;}
.tour_dates_block {position:relative;display:block;line-height: normal;padding: 10px 0px;margin: 20px 10px 0px 10px;text-transform: uppercase;letter-spacing: 1px;border-top: 2px solid white;border-bottom: 2px solid white;}
.tour_dates_block:nth-child(1) {margin-top:0px;}
.tour_dates_block * {text-decoration:none;-webkit-box-sizing: content-box !important;-moz-box-sizing: content-box !important;box-sizing: content-box !important;}
.tour_dates_block a {text-decoration:none !important;}
#date.tour_dates_cell {font-size: 11px;text-align: center;vertical-align: middle;padding: 0px 0px;font-weight: bold;}
#place_city.tour_dates_cell {padding-left:10px;padding-right:10px;}
#place_city.tour_dates_cell span {display:block;word-break: break-word;}
.tour_dates_place {font-size: 16px;margin-bottom: 3px;font-weight: bold;}
.tour_dates_city {font-size:11px;}
#tickets.tour_dates_cell {font-size: 11px;text-align: center;}
.tour_dates_soldout {color: white;text-transform: uppercase;display: inline-block;padding: 5px 8px;border: 2px solid white;}
.tour_dates_completed {color: white;text-transform: uppercase;display: inline-block;padding: 5px 8px;border: 2px solid white;}
#tickets.tour_dates_cell span a {text-transform: uppercase;color: white;display: inline-block;padding: 5px 8px;border: 2px solid white;font-weight:bold !important;text-decoration:none !important;}
#tickets.tour_dates_cell span a:hover {background:black;color:white;text-decoration:none !important;}

PHP Code:

JS Code:

Upcoming Event #3

HTML + CSS Code Preview:

Dec 07 2019

Info Source Tickets

My First Upcoming Event

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

HTML Code: <div class="upcoming_events_block">
<div class="upcoming_events_table">
<div class="upcoming_events_inside">
<div class="upcoming_events_thumbnail">
<img width="380" height="185" src="https://estrelladesign.tk/plugins/wp-content/uploads/2019/10/WV_06-380x185.jpg">
</div>
</div>
<div class="upcoming_events_inside">
<div class="upcoming_events_inside_table">
<div class="upcoming_events_inside_tab_row">
<div class="upcoming_events_date">
<div id="zero">
<span id="one">Dec</span>
<span id="two">07</span>
<span id="three">2019</span>
</div>
<div class="upcoming_events_links">
<a href="https://example.com/" target="_black">Info</a>
<a href="https://example.com/" target="_black">Source</a>
<a href="https://example.com/" target="_black">Tickets</a>
</div>
</div>
<div class="upcoming_events_title">
<span>My First Upcoming Event</span>
<div class="upcoming_events_desc">
<span class="upcoming_events_desc_span">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .upcoming_events_block {display:block;font-size: 11px;font-family: Open Sans, Lato;line-height: normal;margin: 20px 0px;}
.upcoming_events_block * {text-decoration:none;-webkit-box-sizing: content-box !important;-moz-box-sizing: content-box !important;box-sizing: content-box !important;}
.upcoming_events_table {display: block;width:100%;overflow: hidden;}
.upcoming_events_inside {display: block;}
.upcoming_events_thumbnail {display:block;height: auto;overflow:hidden;position: relative;background:black;}
.upcoming_events_thumbnail:after {content:'';position:absolute;width:100%;height:100%;top:0;left:0;background: linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -webkit-linear-gradient(rgba(0, 0, 0, .0), rgb(0, 0, 0, 1));background: -o-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -moz-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -ms-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));}
.upcoming_events_thumbnail img {display: block;width:100%;height: auto;max-width: 100%;outline: none !important;border: none !important;margin: 0 !important;padding: 0 !important;}
.upcoming_events_inside_table {display:table;width: 100%;padding-top: 10px;background: black;color: white;}
.upcoming_events_inside_tab_row {display:table-row;}
.upcoming_events_date {display:table-cell;vertical-align: top;width: 13%;padding: 0 5px;}
.upcoming_events_date #zero {display: block;width: auto;color: white;text-transform: uppercase;letter-spacing: 1px;font-family: Lato, Open Sans;font-size: 10px;margin-bottom: 10px;margin-left: 5px;margin-right: 5px;border-radius: 5px;overflow: hidden;}
.upcoming_events_date #one {display: block;text-align: center;font-size: 11px;font-weight:bold;padding: 5px 5px;background: whitesmoke;color: black;border-bottom: 3px solid lightgray;}
.upcoming_events_date #two {display:block;text-align:center;font-size: 30px;padding: 3px 7px;background: white;color: black;font-weight: bold;}
.upcoming_events_date #three {display:block;color: black;text-align: center;padding: 0px 5px 5px 5px;background: white;}
.upcoming_events_title {display:table-cell;font-family: Lato, Open Sans;vertical-align: top;width: auto;font-size: 16px;text-transform: uppercase;letter-spacing: 1px;padding: 0px 15px 0px 5px;font-weight: bold;}
.upcoming_events_title span {display:block;}
.upcoming_events_desc {display: block;padding: 15px 0px;font-size: 9px;text-transform: none;letter-spacing: 0px;font-weight: normal;font-family: Open Sans, Lato;}
.upcoming_events_desc_span {display:block;border: 1px solid white;padding: 10px;}
.upcoming_events_links {display: block;vertical-align: top;width: auto;text-align:center;color:black;padding: 0px 5px 0px 5px;}
.upcoming_events_links a {text-transform:uppercase;font-family: Lato, Open Sans;letter-spacing:1px;margin: 5px 0px;display: block;padding: 5px 10px;background: white;color: black;font-size: 9px;font-weight:bold;text-decoration:none !important;}
.upcoming_events_links a:hover {background:black;color:white !important;outline:1px solid white;text-decoration:none !important;}

PHP Code:

JS Code:

Current Project #2

HTML + CSS Code Preview:

My First Project

Genre: Movie

Status: Announced

Role: Unknown

When: December, 07 2019

Official Site Trailer IMDb Photos Watch Purchase

HTML Code: <div class="current_projects_block">
<div class="current_projects_block_table">
<div class="current_projects_block_row">
<div class="current_projects_image">
<div class="current_projects_image_inside">
<img width="380" height="185" src="https://estrelladesign.tk/plugins/wp-content/uploads/2019/10/WV_14-380x185.jpg">
</div>
</div>
<div class="current_projects_content">
<div class="current_projects_title">My First Project</div>
<div class="current_projects_info">
<div class="current_projects_info_block">
<span class="current_projects_info_one">Genre:</span>
<span class="current_projects_info_two">Movie</span>
</div>
<div class="current_projects_info_block">
<span class="current_projects_info_one">Status:</span>
<span class="current_projects_info_two">Announced</span>
</div>
<div class="current_projects_info_block">
<span class="current_projects_info_one">Role:</span>
<span class="current_projects_info_two">Unknown</span>
</div>
<div class="current_projects_info_block">
<span class="current_projects_info_one">When:</span>
<span class="current_projects_info_two">December, 07 2019</span>
</div></div><div class="current_projects_desc">
<div class="current_projects_desc_inside"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span>
</div>
</div>
<div class="current_projects_block_links">
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="Official Site" title="Official Site">Official Site</a>
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="Trailer" title="Trailer">Trailer</a>
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="IMDb" title="IMDb">IMDb</a>
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="Photos" title="Photos">Photos</a>
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="Watch" title="Watch">Watch</a>
<a class="current_projects_block_link" href="https://example.com" target="_blank" alt="Purchase" title="Purchase">Purchase</a>
</div>
</div>
</div>
</div>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .current_projects_block {display:block;position:relative;margin: 20px 0px;padding: 0;font-size: 11px;font-family: Open Sans, Lato;line-height: normal;}
.current_projects_block:nth-child(1) {margin-top:0px;}
.current_projects_block * {-webkit-box-sizing: content-box !important;-moz-box-sizing: content-box !important;box-sizing: content-box !important;}
.current_projects_block_links {display: block;margin-top: 15px;font-size: 7px;text-align: center;overflow: hidden;width: 100%;z-index: 9;}
.current_projects_block_link {display: inline-block;text-transform: uppercase;letter-spacing: 1px;text-align:center;background: black !important;color: white !important;border-top: 1px solid white;border-bottom: 1px solid white;padding: 3px 0;margin: 5px 3px;transition: all .5s;-webkit-transition: all .5s;-o-transition: all .9s;-moz-transition: all .5s;text-decoration:none;}
.current_projects_block_link:hover {padding:0 0;text-decoration:none !important;}
.current_projects_block_link a {color:inherit;text-decoration:none !important;}
.current_projects_block_table {display: block;width:100%;}
.current_projects_block_row {display: block;width: 100%;}
.current_projects_image {display: block;padding: 0px;margin: 0px 0 0px 0;}
.current_projects_image_inside {display: block;height: auto;vertical-align: middle;background: black;padding: 0px;transition: all .5s;-webkit-transition: all .5s;-o-transition: all .9s;-moz-transition: all .5s;position: relative;overflow: hidden;}
.current_projects_image_inside:after {content:'';position:absolute;width:100%;height:100%;top:0;left:0;background: linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -webkit-linear-gradient(rgba(0, 0, 0, .0), rgb(0, 0, 0, 1));background: -o-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -moz-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));background: -ms-linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, 1));}
.current_projects_image_inside:hover {}
.current_projects_image img {display: block;width: 100%;height: auto;max-width: 100%;outline: none !important;border: none !important;margin: 0 !important;padding: 0 !important;}
.current_projects_content {display: block;vertical-align: top;padding: 15px;border-left: 1px solid black;border-right: 1px solid black;border-bottom: 1px solid black;background: black;color: white;}
.current_projects_title {font-size: 18px;text-align: left;text-transform:uppercase;letter-spacing:1px;margin-bottom: 10px;font-weight: bold;font-family: Lato;}
.current_projects_info {display:block;}
.current_projects_info_block {font-family: Lato, Open Sans;margin: 3px 0;font-size: 12px;}
.current_projects_info_one {isplay:inline-block;font-weight:bold;}
.current_projects_info_two {display:inline-block;}
.current_projects_desc {display:block;font-size: 10px;margin-top: 20px;}
.current_projects_desc_inside {display: block;width: 100%;}
.current_projects_desc_inside span {display:block;font-family: Open Sans, Lato;padding:10px 10px;background: black;border: 1px solid white;}

PHP Code:

JS Code:

Upcoming Event #2

HTML + CSS Code Preview:

Upcoming Project Title #1

More Buy Tickets Source

31 Dec

HTML Code: <div class="upcoming_event_block_2">
<div class="upcoming_event_line_2">
<div class="upcoming_event_info_2">
<div class="upcoming_event_title_2">Upcoming Project Title #1</div>
<div class="upcoming_event_links_2">
<a href="URL">More</a>
<a href="URL">Buy Tickets</a>
<a href="URL">Source</a>
</div>
</div>
<div class="upcoming_event_date_2">
<span class="upcoming_event_day_2">31</span>
<span class="upcoming_event_month_2">Dec</span>
</div>
</div>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .upcoming_event_block_2 {display:block;margin: 10px 0px;}
.upcoming_event_block_2:first-child {margin-top:0px;}
.upcoming_event_block_2:last-child {margin-bottom:0px;}
.upcoming_event_line_2 {display: table;width: 100%;border-bottom: 5px solid hotpink;}
.upcoming_event_date_2 {display: table-cell;vertical-align: middle;text-align: center;width: 15%;background: hotpink;color: white;padding: 6px;}
.upcoming_event_day_2 {display:block;font-size: 20px;font-weight: bold;}
.upcoming_event_month_2 {display:block;font-size: 15px;font-weight: bold;text-transform: uppercase;letter-spacing: 1px;}
.upcoming_event_year_2 {display:block;font-size: 15px;font-weight: bold;}
.upcoming_event_info_2 {display: table-cell;vertical-align: middle;width: auto;padding: 10px 10px;}
.upcoming_event_title_2 {display: inline-block;font-size: 20px;font-weight: bold;color: hotpink;}
.upcoming_event_links_2 {display:block;font-size: 11px;margin-top: 10px;}
.upcoming_event_links_2 a {display:inline-block;text-decoration:none;padding: 5px;background: hotpink;color: white;text-transform: uppercase;letter-spacing: 1px;font-size: 8px;margin: 0 2px;}
.upcoming_event_links_2 a:first-child {margin-left:0px;}
.upcoming_event_links_2 a:last-child {margin-right:0px;}
.upcoming_event_links_2 a:hover {text-decoration:none;background:black;color:white;}

PHP Code:

JS Code:

Blockquote #2

HTML + CSS Code Preview:

Estrella Design is a web design site that makes a graphic for fansites and social networks. All content and images belong to their owner. Any material seen on this website and is used, to the best of our knowledge, under the "Fair Use" copyright laws. If anything here belongs to you, and you want something to be removed, please contact us before taking any legal actions. All copyright goes to their respective ownersunless it is stated. Thank you very much for visiting.

Quote Author Source of the quote or occupation of the author

HTML Code: <blockquote><strong>Estrella Design</strong> is a web design site that makes a graphic for fansites and social networks. All content and images belong to their owner. Any material seen on this <em>website</em> and is used, to the best of our knowledge, under the "<a href="#" target="_blank">Fair Use</a>" copyright laws. If anything here belongs to you, and you want something to be removed, please contact us before taking any legal actions. All copyright goes to their respective ownersunless it is stated. Thank you very much for visiting.
<br><br>
<div class="quote_someone_author_block_1">
<table width="100%">
<tbody><tr>
<td width="auto">
<span class="quote_someone_author1_1">Quote Author</span>
<span class="quote_someone_author2_1">Source of the quote or occupation of the author</span>
</td>
<td width="60">
<span class="quote_someone_image_1"></span>
</td>
</tr>
</tbody></table>
</div></blockquote>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> blockquote {display:block;font-size: 13px;position: relative;border-left: 10px solid hotpink !important;border-top: 1px solid hotpink !important;border-right: 1px solid hotpink !important;border-bottom: 1px solid hotpink !important;padding: 20px 20px 20px 55px !important;margin:1em 5em !important;line-height: 1.5;color: white !important;}
blockquote strong, blockquote b {color: white !important;font-weight:bold !important;}
blockquote u, blockquote i, blockquote em {color: hotpink !important;}
blockquote a {color:hotpink !important;font-weight:bold !important;}
blockquote:before {content:"\201C";color:hotpink !important;position: absolute;top: 3%;left: 1%;display:block;text-align:left;font-family: Arial;font-size: 9em;line-height: 1;}

.quote_someone_author_block_1 {display:block;text-align: right;}
.quote_someone_author1_1 {display:block;text-align: right;font-size: 10px;font-weight: bold;}
.quote_someone_author2_1 {display:block;text-align: right;font-size: 9px;}
.quote_someone_image_1 {display:inline-block;background: hotpink !important;width: 50px;height: 50px;border-radius: 50%;}
.quote_someone_image_1 img {width:inherit;height:inherit;margin: 0;padding: 0;border: none;border-radius: 50%;}

@media screen and (max-width:1024px) {blockquote {margin:1em 0em;}}

PHP Code:

JS Code:

Gallery Images + Gallery Link #2

HTML + CSS Code Preview:

Home > Your Category #1 > Your Album Title Goes Here

HTML Code: <a href="URLTOALBUM">
<div class="gallery_links_2">
<table width="100%" border="0" cellpadding="10" cellspacing="10">
<tr>
<td width="25%">
<img src="https://estrelladesign.tk/cpg/albums/other_images/thumb_slide-5-image.jpg">
</td>
<td width="25%">
<img src="https://estrelladesign.tk/cpg/albums/other_images/thumb_010.jpg">
</td>
<td width="25%">
<img src="https://estrelladesign.tk/cpg/albums/other_images/thumb_ZiNvk7l.jpg">
</td>
<td width="25%">
<img src="https://estrelladesign.tk/cpg/albums/other_images/thumb_maxresdefault_28129.jpg">
</td>
</tr>
</table>
<div class="gallery_links_2_links">
<div class="gallery_links_2_link">
<span id="left">Home > Your Category #1 > <a href="URLTOALBUM">Your Album Title Goes Here</a></span>
</div>
</div>
</div>
</a>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .gallery_links_2 {display:block;}
.gallery_links_2 img {margin:0px;padding:5px;width:auto;border: 1px solid hotpink;border-radius: 0px;}
.gallery_links_2 img:hover {border: 1px solid hotpink;opacity:1;background:hotpink;}
.gallery_links_2_links {display:block;margin:10px 10px;}
.gallery_links_2_link {display:block;margin: 10px 0px;font-size: 13px;}
.gallery_links_2_link #left {display:inline-block;color:#ce2e7e;}
.gallery_links_2_link #left a {color:hotpink;text-decoration: none;font-weight:bold !important;}
.gallery_links_2_link #left a:hover {color:black;border-bottom:none;}
.gallery_links_2_link:last-child {margin-bottom:0px;}

PHP Code:

JS Code:

Blockquote #1

HTML + CSS Code Preview:

Estrella Design is a web design site that makes a graphic for fansites and social networks. All content and images ~~belong~~ to their owner. Any material seen on this website and is used, to the best of our knowledge, under the "Fair Use" copyright laws. If anything here belongs to you, and you want something to be removed, please contact us before taking any legal actions. All copyright goes to their respective ownersunless it is stated. Thank you very much for visiting.

HTML Code: <div class="blockquote_block">
<span><strong>Estrella Design</strong> is a web design site that makes a graphic for <em>fansites</em> and social networks. All <a href="#" target="_blank">content</a> and images <del>belong</del> to their owner. Any material seen on this website and is used, to the best of our knowledge, under the "Fair Use" copyright laws. If anything here belongs to you, and you want something to be removed, please contact us before taking any legal actions. All copyright goes to their respective ownersunless it is stated. Thank you very much for visiting.</span>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .blockquote_block {display:block;position:relative;padding: 25px;margin: 3em 5em;border-top:1px solid lightgray;border-bottom:1px solid lightgray;font-size: 14px;line-height: normal;font-weight:lighter;}
.blockquote_block:before {content:"\201C";position: absolute;top: 0%;left: 50%;transform: translate(-50%, -70%);font-size: 100px;font-family: Arial;width: 70px;text-align: center;height: 50px;}
@media screen and (max-width:1024px) {.blockquote_block{margin:3em 0em;}}

PHP Code:

JS Code:

Affiliate Sites #1

HTML + CSS Code Preview:


Your First Site Title Your Second Site Title Your Third Site Title Your Fourth Site Title
Apply For Affiliates

HTML Code: <div class="affiliates_block">
<table width="100%" border="0" cellpadding="5" cellspacing="5">
<tr id="affiliates">
<td width="20%" id="affiliates"><a href="URLTOSITE"><img src="https://estrelladesign.tk/wp-content/uploads/2021/01/ed_twitter.jpg"></a></td>
<td width="20%" id="affiliates"><a href="URLTOSITE"><img src="https://estrelladesign.tk/wp-content/uploads/2021/01/ed_twitter.jpg"></a></td>
<td width="20%" id="affiliates"><a href="URLTOSITE"><img src="https://estrelladesign.tk/wp-content/uploads/2021/01/ed_twitter.jpg"></a></td>
<td width="20%" id="affiliates"><a href="URLTOSITE"><img src="https://estrelladesign.tk/wp-content/uploads/2021/01/ed_twitter.jpg"></a></td>
<td width="20%" id="affiliates"><a href="URLTOSITE"><img src="https://estrelladesign.tk/wp-content/uploads/2021/01/ed_twitter.jpg"></a></td>
</tr>
<tr>
<td colspan="5">
<div class="affiliates_links">
<a href="URLTOSITE">Your First Site Title</a>
<a href="URLTOSITE">Your Second Site Title</a>
<a href="URLTOSITE">Your Third Site Title</a>
<a href="URLTOSITE">Your Fourth Site Title</a>
</div>
</td>
</tr>
<tr>
<td colspan="5">
<div class="affiliates_apply">
<a href="URLTOSITE">Apply For Affiliates</a>
</div>
</td>
</tr>
</table>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .affiliates_block img {width:100%;margin:0px;border:3px solid lightgray;border-radius:0px;}
.affiliates_block img:hover {border: 3px solid black;}
.affiliates_links {display:block;}
.affiliates_apply {display:block;}
.affiliates_links a {display:block;text-decoration:none;margin: 5px 0;font-size: 11px;}
.affiliates_links a:before {content:"• ";}
.affiliates_links a:hover {text-decoration:none;color:black;}
.affiliates_apply a {display:block;text-decoration:none;padding: 10px;text-align: center;font-size: 14px;background: whitesmoke;text-transform: uppercase;letter-spacing: 1px;}
.affiliates_apply a:hover {text-decoration:none;background:black;color:white;}

PHP Code:

JS Code:

Upcoming Event #1

HTML + CSS Code Preview:

Dec

2021

Upcoming Project Title #1

HTML Code: <div class="upcoming_event_block_1">
<div class="upcoming_event_line_1">
<div class="upcoming_event_date_1">
<div class="upcoming_event_day_1">31</div>
<div class="upcoming_event_month_1">Dec</div>
<div class="upcoming_event_year_1">2021</div>
</div>
<div class="upcoming_event_info_1">
<div class="upcoming_event_title_1">Upcoming Project Title #1</div>
<div class="upcoming_event_desc_1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </div>
</div>
</div>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .upcoming_event_block_1 {display:block;border:1px solid lightgray;padding:10px;margin: 10px 0px;}
.upcoming_event_block_1:first-child {margin-top:0px;}
.upcoming_event_block_1:last-child {margin-bottom:0px;}
.upcoming_event_line_1 {display: table;width: 100%;}
.upcoming_event_date_1 {display: table-cell;vertical-align: top;text-align: center;width: 15%;}
.upcoming_event_day_1 {display:block;font-size: 25px;background: black;color: white;padding: 5px;font-weight: bold;}
.upcoming_event_month_1 {display:block;font-size: 15px;background: whitesmoke;color: black;padding: 5px;font-weight: bold;text-transform: uppercase;letter-spacing: 1px;}
.upcoming_event_year_1 {display:block;color: black;font-size: 11px;background: lightgray;padding: 5px;font-weight: bold;}
.upcoming_event_info_1 {display: table-cell;vertical-align: top;width: auto;padding: 0px 10px;}
.upcoming_event_title_1 {display: inline-block;font-size: 20px;padding-bottom: 2px;margin-bottom: 10px;font-weight: bold;border-bottom: 3px solid black;}
.upcoming_event_desc {display:block;font-size: 11px;}

PHP Code:

JS Code:

Site Information #1

HTML + CSS Code Preview:

Site Name: Estrella Design Coding

Administrator: Maria

Opening: January, 1st 2021

Site Language: English

Mobile Version: Yes

Contact: EMAIL OR URL

HTML Code: <div class="site_information_block">
<div class="site_information_line"><strong>Site Name:</strong> <span>Estrella Design Coding</span></div>
<div class="site_information_line"><strong>Administrator:</strong> <span>Maria</span></div>
<div class="site_information_line"><strong>Opening:</strong> <span>January, 1st 2021</span></div>
<div class="site_information_line"><strong>Site Language:</strong> <span>English</span></div>
<div class="site_information_line"><strong>Mobile Version:</strong> <span>Yes</span></div>
<div class="site_information_line"><strong>Contact:</strong> <span><a href="EMAILORURL">EMAIL OR URL</a></span></div>
</div>

CSS Code:
If you are not going to add this code to the file style.css, then you should include this code in these tags: <style></style> .site_information_block {display:block;padding: 5px;border: 1px solid lightgray;}
.site_information_line {display:block;padding: 10px;font-size: 13px;background:whitesmoke;color:black;font-size:11px;}
.site_information_line:nth-child(even) {background:lightgray;color:black;}
.site_information_line strong {color:black;font-weight:bold !important;vertical-align:middle;text-transform: uppercase;letter-spacing: 1px;}
.site_information_line span {display:inline-block;vertical-align:middle;font-size: 12px;}
.site_information_line a {color:gray;text-decoration:none;text-transform:inherit;}

PHP Code:

JS Code:

See All The Code Snippets

Untagged

Advertisement Block

Current Orders

No Orders Are In Work...

Archived Orders

Celebrity Photos #3. Coppermine No Additional Packages

Blackpink Photos #3. Coppermine No Additional Packages

Dua Lipa Daily #3. Coppermine No Additional Packages

See all the orders

About The Creator

Maria

Hello, my name is Maria, I am 26, was born in Russia, have experience in creating layouts for Wordpress and Coppermine. I have loved working on designs for sites since 2012 when I opened my fan site Aly & AJ Russia, which is dedicated to Aly & AJ. I did not know much about HTML, CSS, and PHP when I just started my site on Blogger. But when I decided to move my site to Wordpress and Coppermine, I started to learn HTML, CSS and PHP and try to work in Photoshop much better and now know quite much to create a good layout that would be workable for anyone. Nevertheless, I still have too much to learn, even if I always try to get my works better and make those, who order from me, pleased with my work. I try to complete orders quickly and make what you would like to have. Check out my portfolio and order a layout for your site if you want...

Elites & Affiliates

Family Sites

Estrella Rose Author

Aly & AJ Russia

Site Information

Site Name: Estrella Design

Opening: January, 1st 2018

Creator/Administrator: Maria

Orders: Not Accepting

Powered by: Wordpress

Language: English

Theme: The Girl Power by Estrella Design

Hosted by: Flaunt Network
DMCA | Privacy Policy

Contact: • •

Donations

Make a Donation

If you want to support Estrella Design and thank us for our work, you can make a donation for any amount. We would be grateful to you even for $0.1. If you have any problems and questions, let us know. We are currently testing payment methods – so, more things might be added soon.

Donate

Estrella Design

Your Source for Wordpress, Coppermine, Twitter and Facebook Graphics

Estrella Design is a web design site that makes a graphic for fansites and social networks. No copyright infringement is intented. Any material seen on this website and is used, to the best of our knowledge, under the "Fair Use" copyright laws. If anything here belongs to you, please contact us before taking any legal actions. All copyright goes to their respective ownersunless it is stated. Thank you for visiting.