how to add template arrow on enfold？

Hey keir2012,
To start you will need to add a custom full width widget above your footer and give it the same background color as your footer, this will allow your arrow to be centered and look a part of your footer. Please see this post for guidance on creating the widget. (it talks about making two, but just make one)
Then this is the code for the arrow, add it to a html widget:

<div class="footer_arrow">
								<div class="inner_content"><div class="arrow-left-small"></div><div class="arrow-right-small"></div><h3>Need help? <a href="https://kriesi.at/themes/replete/contact/">Mail Us!</a></h3></div>
								<div class="footer_arrow_wrap">
								<div class="arrow-left"></div><div class="arrow-right"></div>
								</div>
							  </div>

Then this is the css for your General Styling > Quick CSS field:

.footer_arrow {
text-align: center;
position: absolute;
width:100%;
top:-32px;
overflow: hidden;
display:none;
}

.footer_arrow{display:block;}

.footer_arrow div{
position: relative;
}

#top .footer_arrow .inner_content{
display: block;
padding: 0 30px;
margin: 0;
position: relative;
z-index: 2;
margin: 0 auto;
width:300px;
height:32px;
}

#top .footer_arrow .inner_content h3{
position: relative;
padding:20px 0 0 0;
}

#top .footer_arrow .inner_content h3 a{text-decoration: underline;}
#top .footer_arrow .inner_content h3 a:hover{text-decoration: none;}

#top .footer_arrow_wrap{
background: none;
overflow: hidden;
height:100px;
display: none;
}

#top .footer_arrow_wrap,.footer_arrow .arrow-right-small, .footer_arrow .arrow-left-small {
display:block;
}

.footer_arrow .arrow-right,.footer_arrow .arrow-left{
width:50%;
height:100px;
position: absolute;
top:-75px;
}

.footer_arrow .arrow-right{
-webkit-transform : skew(0deg, 7deg);
-moz-transform : 	skew(0deg, 7deg);
-ms-transform : 	skew(0deg, 7deg);
-o-transform : 		skew(0deg, 7deg);
transform : 		skew(0deg, 7deg);
left:1px;
}

.footer_arrow .arrow-left{
-webkit-transform : skew(0deg, -7deg);
-moz-transform : 	skew(0deg, -7deg);
-ms-transform : 	skew(0deg, -7deg);
-o-transform : 		skew(0deg, -7deg);
transform : 		skew(0deg, -7deg);
left:auto;
right:1px;
}

.footer_arrow .arrow-right-small, .footer_arrow .arrow-left-small {
width: 40px;
height: 40px;
position: absolute;
top: -13px;
-webkit-transform: 	rotate(-32deg) skew(0, 0);
-moz-transform: 	rotate(-32deg) skew(0, 0);
-o-transform: 		rotate(-32deg) skew(0, 0);
-ms-transform: 		rotate(-32deg) skew(0, 0);
transform: 			rotate(-32deg) skew(0, 0);
left: -13px;
}

.footer_arrow .arrow-right-small{
-webkit-transform: 	rotate(32deg) skew(0, 0);
-moz-transform: 	rotate(32deg) skew(0, 0);
-o-transform: 		rotate(32deg) skew(0, 0);
-ms-transform: 		rotate(32deg) skew(0, 0);
transform: 			rotate(32deg) skew(0, 0);
right: -13px;
left:auto;
}
 .footer_arrow div, .footer_arrow .inner_content {
    background-color: #816a99;
    color: #fff; 
    border-color: #816a99;
    border-top-color: rgb(129, 106, 153);
    border-right-color: rgb(129, 106, 153);
    border-bottom-color: rgb(129, 106, 153);
    border-left-color: rgb(129, 106, 153);
}

Here is an example I quickly did using a code block element at the bottom of a page, which gives you the idea, but also made me realize that using a custom full width widget would work better.

Best regards,
Mike

Hi,
That is great news! Glad we were able to help, we will close this now. Thank you for using Enfold.

For your information, you can take a look at Enfold documentation here
and the video tutorials here
And if there are features that you wish Enfold had, you can request them and vote the requested ones here
For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

Best regards,
Mike