Comment Box இற்கு Bubble Style இல் Border அமைத்தல்

இன்று நாம் எப்படி பிளாக்கர் இல் உள்ள COMMENTS க்கு Bubble Style இல் பெட்டி (Border ) அமைப்பது என்பதைப் பற்றி பார்ப்போம்.

1. முதலாவது உங்களுடைய பிளாக்கர் Account இல் நுழைந்து கொள்ளுங்கள்.
2. அதில் dashboard >>template >> EDIT HTML
3. நீங்கள் ]]></b:skin> என்பதை தேடி அதன் மேல் கீழுள்ள CSS Code இணை Copy & Past செய்து கொள்ளுங்கள்.

/* Start Comment Style Code http://tamilcomputerblog.blogspot.com/ */ .comments{clear:both;margin-top:10px;margin-bottom:0;font-family:Arial;line-height:18px;font-size:13px} .comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:left} .comments .comment .comment-actions a,.comments .comment .continue a{display:inline-block;margin:0 0 10px 10px;padding:0 15px;color:#424242 !important;text-align:center;text-decoration:none;background:#fede72;border:1px solid #fec648;border-radius:2px;height:26px;line-height:28px;font-weight:normal;cursor:pointer} .comments .comments-content .comment-thread ol{list-style-type:none;padding:0;text-align:none} .comments .comments-content .inline-thread{padding:0} .comments .comments-content .comment-thread{margin:8px 0} .comments .comments-content .comment-thread:empty{display:none} .comment-replies{margin-top:1em;margin-left:40px;background:#fff} .comments .comments-content .comment{margin-bottom:0;padding-bottom:0} .comments .comments-content .comment:first-child{padding-top:16px} .comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0} .comments .comments-content .comment-body{position:relative} .comments .comments-content .user{font-style:normal;font-weight:normal} .comments .comments-content .user a{color:#0E6284;font-weight:normal;text-decoration:none} .comments .comments-content .icon.blog-author{width:18px;height:18px;display:inline-block;margin:0 0 -4px 6px} .comments .comments-content .datetime a{color:#0E6284;font-size:12px;float:right;text-decoration:none} .comment-content{margin:0 0 8px;padding:0 5px} .comment-header{font-size:18px;background-color:#f1f1f1;border-bottom:1px solid #e3e3e3;padding:5px} .comments .comments-content .owner-actions{position:absolute;right:0;top:0} .comments .comments-replybox{border:none;height:230px;width:100%} .comments .comment-replybox-thread{margin-top:0} .comments .comment-replybox-single{margin-top:5px;margin-left:48px} .comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center} .comments .thread-toggle{cursor:pointer;display:inline-block} .comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0} .comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden} .comments .thread-chrome.thread-collapsed{display:none} .comments .thread-toggle{display:inline-block} .comments .thread-toggle .thread-arrow{display:inline-block;height:6px;width:7px;overflow:visible;margin:0.3em;padding-right:4px} .comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent} .comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent} .avatar-image-container{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiGMTwgYf8caHl_SNR1tY7YBgnZwnu385083hjVAPkNU6_JP43sagUsraMPpV2s25dBtNn7BdhuAwV6lQI2iOYNICBiDm8JgZlCL-mef8cuXOoNgwr8TB7oulMBhKrVD0tcV9V8Jm0JB4/s51/arrow.png) top right no-repeat;float:left;vertical-align:middle;overflow:hidden;width:65px !important;height:51px !important;max-width:65px !important;max-height:51px !important} .comments .avatar-image-container img{padding:2px;border:1px solid #ccc;width:45px !important;height:45px !important;max-width:45px !important;max-height:45px !important} .comments .comment-block{margin-left:65px;position:relative;border:5px solid #e3e3e3;border-radius:8px} @media screen and (max-device-width:480px){.comments .comments-content .comment-replies{margin-left:0}} /* End Comment Style Code http://tamilcomputerblog.blogspot.com/ */

   4. உங்களுடைய Template இணை Save செய்து விட்டு பாருங்கள்.

இந்தபதிவை மற்றவர்களும் படித்து பயன் பெற சமூக தளங்களில் பகிர்ந்து கொள்ளுங்கள் .

இந்தப் பதிவில் ஏதும் குறை இருந்தால் மறக்காமல் COMMENT BOX இல் தெரிவியுங்கள். இப்பதிவைப்பற்றி உங்கள் கருத்துக்களையும் கூறி விடுங்கள். ===நன்றி ===

இந்த செய்தியை நண்பர்களுடன் பகிர்ந்து கொள்ள...

எமது உத்தியோகபூர்வ பேஸ்புக் பக்கம்

எமது செய்திகளை உடனுக்குடன் பேஸ்புக் மூலம் அறிந்து கொள்ள எமது பேஸ்புக் பக்கத்தை லைக் (like) செய்க!

முக்கிய குறிப்பு :

எமது இணையத்தளத்துக்கு அனுப்பிவைக்கப்படும் ஆக்கங்கள் , செய்திகள் என்பவற்றுக்கு அதனை அனுப்பிவைப்பவர்களே பொறுப்பாளிகள் ஆவர். தவறான அல்லது பிழையான, அவதூறு, பிறர் மனங்களை புண்படுத்தும் செய்திகள் அல்லது தகவல்களுக்கு எமது நிருவாகமோ இணையத்தளமோ பொறுப்பாளியல்ல. இதனைக்கருத்தில் கொண்டு தகவல் தொடர்புகளை மேற்கொள்ளுமாறு வேண்டுகின்றோம்.- நிருவாகம் -