Trần VươngDesign

Tạo nút gọi tăng chuyển đổi cho website

Chèn HTML

</pre>
<table>
<tbody>
<tr>
<td class="line-content"><span class="html-tag"><div <span class="html-attribute-name">class</span>="<span class="html-attribute-value">call-now</span>" <span class="html-attribute-name">data-toggle</span>="<span class="html-attribute-value">popover</span>" <span class="html-attribute-name">data-trigger</span>="<span class="html-attribute-value">hover</span>" <span class="html-attribute-name">data-html</span>="<span class="html-attribute-value">true</span>" <span class="html-attribute-name">data-placement</span>="<span class="html-attribute-value">top</span>" <span class="html-attribute-name">title</span>="" <span class="html-attribute-name">data-content</span>="<span class="html-attribute-value"><p>Chúng tôi luôn sẵn sàng Tư vấn - Giải đáp mọi thắc mắc của Quý khách.</p><p>Hoạt động 24/7 - Tất cả các ngày trong tuần, kể cả ngày lễ.</p></span>" <span class="html-attribute-name">data-original-title</span>="<span class="html-attribute-value">Đường dây nóng</span>"></span></td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content"><span class="html-tag"><a <span class="html-attribute-name">class</span>="<span class="html-attribute-value">btn-call-now</span>" <span class="html-attribute-name">href</span>="<a class="html-attribute-value html-external-link" href="tel:0938.123.657" target="_blank" rel="noreferrer noopener">tel:0938.123.657</a>" <span class="html-attribute-name">onclick</span>="<span class="html-attribute-value">ga('send', 'event', 'Call tracking', 'Click to call', 'Phone in mobile');</span>"></span></td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content"><span class="html-tag"><i <span class="html-attribute-name">class</span>="<span class="html-attribute-value">fa fa-phone</span>" <span class="html-attribute-name">aria-hidden</span>="<span class="html-attribute-value">true</span>"></span><span class="html-tag"></i></span> <span class="html-tag"><p></span>Tư vấn miễn phí (24/7) <span class="html-tag"><strong></span>0938.123.657<span class="html-tag"></strong></span><span class="html-tag"></p></span></td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content"><span class="html-tag"></a></span> <span class="html-tag"></div></span></td>
</tr>
</tbody>
</table>
<pre>

Chèn CSS

</pre>
<table>
<tbody>
<tr>
<td class="line-content">.call-now {</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">left: 0;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">bottom: 0px;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">height: 50px;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">min-width: 200px;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">position: fixed;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">background-color: #e54016;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">border-radius: 0 25px 25px 0;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">box-shadow: 0 1px 2px rgba(0,0,0,.8);</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">z-index: 998;}</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">a:link, a:visited, a:active { text-decoration: none;}</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">.call-now .btn-call-now i { position: absolute; color: #e54016; background-color: #fff; font-size: 35px;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">right: 0; height: 50px; width: 50px; line-height: 50px; text-align: center; border-radius: 50%;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">border: 1px solid #e54016;}</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">.call-now .btn-call-now p { color: #fff; line-height: 25px; font-size: 14px; min-width: 150px;</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">text-align: center; vertical-align: middle; display: inline-block;}</td>
</tr>
<tr>
<td class="line-number"></td>
<td class="line-content">.call-now .btn-call-now strong { display: block; font-size: 18px;}</td>
</tr>
</tbody>
</table>
<pre>