<script>
    clBlogs.setData({
        blogId: '{post_id}',
        numberCommentsFrmShow: '{number_comments_frm_show}'*1,
        pageBlogs : '{page_my_blogs}'
    })

    clBlogs.initPpImage();
</script>
<div class="blogs_post_content">
    {post_text_readable}
</div>

<!-- begin_module_posts_random -->
<div class="wrapper-articles also_like">
      <div class="row">
        <div class="col-md-12">
          <h3 class="cham-heading">{l_you_may_also_like}</h3>
        </div>
      </div>

      <div class="cham-blog-style-2">
        <div class="row">
            <!-- begin_post_random_item -->
            <div class="col-md-6 col-sm-6 col-md-offset-0 link-block-bl">
                <a href="{post_random_url}" class="link-block"  onclick="goLinkUserBlogs($(this), '{post_random_url}', '.link-block-bl'); return false;">
                    <figure>
                        <div class="cham-overlay2"></div>
                        <div data-cl-loader="layer_action_list_loader" data-no-fade-in="true" class="pic rectangle <!-- begin_post_random_item_image_placeholder -->image_placeholder<!-- end_post_random_item_image_placeholder -->" style="background-image:url({post_random_image});"></div>
                        <div class="layer_blocked_item_list"></div>
                    </figure>
                    <h3>{post_random_title}</h3>
                    <p><span class="cham-meta">{post_random_time_ago}</span></p>
                </a>
            </div>
            <!-- end_post_random_item -->
        </div>
      </div>
</div>
<!-- end_module_posts_random -->

<!-- begin_blog_post_block_module_action -->
<!-- begin_blog_post_like -->
<div id="blog_post_feed_like_result" class="who_liked {blog_post_like_class}">
    <div class="who_liked_bl">
        <!-- begin_link_unlike -->
        <span id="blog_post_feed_like_hand" class="who_liked_link" onclick="clBlogs.likeDelete();" title="{a_unlike}">
            <span class="glyphicon glyphicon-thumbs-up icon" data-no-fade-in="true" data-cl-loader="icon_wall_loader_hand"></span>
        </span>
        <!-- end_link_unlike -->
        <!-- begin_icon_like -->
        <span id="blog_post_feed_like_hand" class="who_liked_link" onclick="clBlogs.likeAdd();" title="{a_like}">
            <span class="glyphicon glyphicon-thumbs-up icon" data-no-fade-in="true" data-cl-loader="icon_wall_loader_hand"></span>
        </span>
        <!-- end_icon_like -->

        <!-- begin_wall_like_one -->
        {wall_like_one}
        <!-- end_wall_like_one -->

        <!-- begin_wall_like_you -->{l_wall_you}<!-- end_wall_like_you --><!-- begin_wall_like_user -->{wall_like_delimiter}<a href="{wall_like_user_url}">{wall_like_name}</a><!-- end_wall_like_user -->

        <!-- begin_wall_like_more -->
        {wall_and_more_people_like_this}
        <!-- end_wall_like_more -->

        <!-- begin_wall_like_names -->
        {l_wall_several_people_like_this}
        <!-- end_wall_like_names -->
    </div>
    <script>clBlogs.setLikePostInfo('{blog_post_like_user_list}');</script>
</div>
<!-- end_blog_post_like -->

<div class="like_comment_and_share">
    <ul class="list">
        <!-- begin_blog_post_module_like -->
        <li id="blog_post_feed_like_action" class="feed_btn_like {wall_like_hidden}">
            <a href="#" title="{a_like}" onclick="clBlogs.likeAdd($(this)); return false;" class="feed_like_like">
                <span class="glyphicon glyphicon-thumbs-up icon" data-cl-loader="icon_wall_loader" data-no-fade-in="true"></span>{l_like}
            </a>
            <a href="#" title="{a_unlike}" onclick="clBlogs.likeDelete($(this)); return false;" class="feed_like_unlike">
                <span class="glyphicon glyphicon-thumbs-up icon" data-cl-loader="icon_wall_loader" data-no-fade-in="true"></span>{l_you_like_this}
            </a>
        </li>
        <!-- end_blog_post_module_like -->
        <!--<li>
            <a href="#" data-cid="{id}" onclick="clBlogs.showFrmTop(); return false;">
                <i class="fa fa-comment-o" aria-hidden="true"></i>{l_comment}
            </a>
        </li>-->
    </ul>

    <ul class="how_many_comments_shares">
        <li id="blogs_post_comments_count" data-count="{blogs_post_comments_count}" class="wall_item_comments_count <!-- begin_blogs_post_comments_count_title_hide -->to_hide<!-- end_blogs_post_comments_count_title_hide -->">
            <i class="fa fa-comment-o" aria-hidden="true"></i>
            <span class="comments_count">{blogs_post_comments_count_title}</span>
        </li>
    </ul>
    <div class="clearfix"></div>
 </div>
<!-- end_blog_post_block_module_action -->

<!-- begin_blog_post_comments_enabled -->
<div class="bl_wall bl_wall_blog_post">
    <div id="blogs_post_feed_comment_top" class="photo_and_field_comment" <!-- begin_blogs_feed_comment_top_frm_show -->style="display: block;"<!-- end_blogs_feed_comment_top_frm_show -->>

		<div class="photo">
            <a href="{comment_guid_url}" class="pic profile_photo_r_{comment_guid_uid} to_hide" style="background-image:url({url_files}{comment_guid_photo});"></a>
            <script>onLoadImgToShow('{url_files}{comment_guid_photo}','',function(){$('.profile_photo_r_{comment_guid_uid}.to_hide').removeClass('to_hide')})</script>
        </div>

        <div id="blogs_post_comment_top" class="field_comment field_comment_wrap comment_container_textarea">
			<div id="blogs_post_comment_top_{post_id}" tabindex="0" role="textbox" aria-multiline="true" contenteditable="true" data-placeholder="{a_write_your_comment}" class="form-control textarea"></div>

            <!--<textarea id="blogs_post_comment_area_top_{post_id}" placeholder="{a_write_a_comment}" class="form-control wall_comment_area wall_comment_area_top"></textarea>
            -->
			<div class="comment_action">
				<div id="blogs_post_comment_top_sticker" title="{a_stickers}" data-input="#blogs_post_comment_top_{post_id}" onclick="stickerBlockShowWall(this)" class="comment_sticker_btn"></div>

				<div id="blogs_post_comment_top_smile" title="{a_smilies}" data-input="#blogs_post_comment_top_{post_id}" onclick="smileBlockShowWall(this)" class="wall_comment_smile_btn">
					<i class="fa fa-smile-o" aria-hidden="true"></i>
				</div>

				<!-- begin_feed_comment_audio_top -->
				<div class="im_audio_message_recorder">
					<span class="audio_visualizer"></span>
					<span data-cl-children=".fa-circle" class="im_audio_message_recorder_icon_bl" title="{a_record_audio_message}" onclick="runAudioRecorder('#blogs_post_feed_comment_top');">
						<i class="fa fa-microphone" aria-hidden="true"></i>
						<i class="fa fa-circle" aria-hidden="true"></i>
					</span>
				</div>
				<!-- end_feed_comment_audio_top -->

                <!-- begin_blog_post_comment_top_drawer -->
                <div id="blog_post_comment_top_drawer" onclick="ImageDrawer.show(this, 'blog_post_comment_top_drawer')" class="wall_comment_smile_btn icon_drawer">
                    <i class="fa fa-pencil-square" aria-hidden="true"></i>
                </div>
                <!-- end_blog_post_comment_top_drawer -->

				<div id="blogs_post_comment_top_upload_img" class="comment_upload_img disabled">
					<div id="blogs_post_comment_top_upload_img_loader" class="comment_upload_img_loader"></div>

					<button id="blogs_post_comment_top_upload_img_edit" onclick="openEditorCommentUploadImage('blogs_post_comment_top_upload_img'); return false;" title="{a_edit_image}" class="btn btn-success comment_upload_img_editor">
							<span class="btn_wrap">
							<span class="icon_fa"  data-no-fade-in="true">
								<svg height="24" width="24" viewBox="0 0 24 24">
									<path d="M17.484 12c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM14.484 8.016c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM9.516 8.016c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM6.516 12c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM12 3c4.969 0 9 3.609 9 8.016 0 2.766-2.25 4.969-5.016 4.969h-1.734c-0.844 0-1.5 0.656-1.5 1.5 0 0.375 0.141 0.703 0.375 0.984s0.375 0.656 0.375 1.031c0 0.844-0.656 1.5-1.5 1.5-4.969 0-9-4.031-9-9s4.031-9 9-9z"></path>
								</svg>
							</span>
						</span>
					</button>
					<script>initCommentUploadImageEditor($('#blogs_post_comment_top_upload_img_edit'));</script>

					<i class="fa fa-camera" onclick="clearCommentUploadImage('blogs_post_comment_top_upload_img', true, true, event);" title="{a_upload_image}" aria-hidden="true"></i>

					<span class="count_upload_image">
						<i class="fa fa-check" aria-hidden="true"></i>
						<i class="fa fa-times" aria-hidden="true"></i>
					</span>

					<form id="blogs_post_comment_top_upload_img_frm" method="post" enctype="multipart/form-data" action="" onsubmit="return false;">
						<input class="comment_upload_img_input_file" type="file" accept="image/jpg,image/jpeg,image/png,image/gif" name="file_add_wall_{id}" onclick="clickCommentUploadImage($(this));" onChange="changeCommentUploadImage($(this));"/>
						<input class="inp_hide" type="reset" value=""/>
						<input class="inp_hide" type="submit" value=""/>
					</form>
					<script>initCommentUploadImage('blogs_post_comment_top_upload_img');</script>
				</div>
				<button class="wall_post_send">
					<svg viewBox="0 0 24 24">
						<path d="M21.5,11.1l-17.9-9C2.7,1.7,1.7,2.5,2.1,3.4l2.5,6.7L16,12L4.6,13.9l-2.5,6.7c-0.3,0.9,0.6,1.7,1.5,1.2l17.9-9   C22.2,12.5,22.2,11.5,21.5,11.1z" />
					</svg>
				</button>
			</div>
			<script>clBlogs.initFeedComment('#blogs_post_comment_top_{post_id}');</script>

        </div>
    </div>

    <!--begin_blog_post_load_more_comments -->
    <div id="blogs_post_load_more_comments_bl" class="like_comment_and_share_bl">
        <div class="like_comment_and_share more">
            <a href="#" class="comments_replies_load_link" onclick="clBlogs.loadMoreComments($(this),0); return false;">
                <span data-no-fade-in="true" data-cl-loader="icon_wall_loader" class="glyphicon glyphicon-comment icon"></span>
                <span class="comments_replies_load_title">{blog_post_load_more_comments_number_title}</span>
            </a>
            <div class="comm_to_comm_text_number <!-- begin_blog_post_load_more_comments_number -->to_show<!-- end_blog_post_load_more_comments_number -->">
                {blog_post_load_more_comments_number}
            </div>
        </div>
    </div>
    <!--end_blog_post_load_more_comments -->

    <div id="blogs_post_comments" class="bl_comments blogs_post_comments">
        <!-- begin_comment -->
        {comment_item}
        <!-- end_comment -->
    </div>

    <div id="blogs_post_feed_comment_bottom" class="photo_and_field_comment" <!-- begin_blogs_feed_comment_bottom_frm_show -->style="display: block;"<!-- end_blogs_feed_comment_bottom_frm_show -->>
        <div class="photo">
            <a href="{comment_guid_url}" class="pic profile_photo_r_{comment_guid_uid} to_hide" style="background-image:url({url_files}{comment_guid_photo});"></a>
            <script>onLoadImgToShow('{url_files}{comment_guid_photo}','',function(){$('.profile_photo_r_{comment_guid_uid}.to_hide').removeClass('to_hide')})</script>
        </div>
        <div class="field_comment comment_container_textarea">
            <div id="blogs_post_comment_bottom_{post_id}" tabindex="0" role="textbox" aria-multiline="true" contenteditable="true" data-placeholder="{a_write_your_comment}" class="form-control textarea"></div>

            <!--<textarea id="blogs_post_comment_area_bottom_{post_id}" placeholder="{a_write_a_comment}" class="form-control wall_comment_area wall_comment_area_bottom"></textarea>
            -->
			<div class="comment_action">
				<div id="blogs_post_comment_bottom_sticker" title="{a_stickers}" data-input="#blogs_post_comment_bottom_{post_id}" onclick="stickerBlockShowWall(this)" class="comment_sticker_btn"></div>

				<div id="blogs_post_comment_bottom_smile" title="{a_smilies}" data-input="#blogs_post_comment_bottom_{post_id}" onclick="smileBlockShowWall(this)" class="wall_comment_smile_btn">
					<i class="fa fa-smile-o" aria-hidden="true"></i>
				</div>

				<!-- begin_feed_comment_audio_bottom -->
				<div class="im_audio_message_recorder">
					<span class="audio_visualizer"></span>
					<span data-cl-children=".fa-circle" class="im_audio_message_recorder_icon_bl" title="{a_record_audio_message}" onclick="runAudioRecorder('#blogs_post_feed_comment_bottom');">
						<i class="fa fa-microphone" aria-hidden="true"></i>
						<i class="fa fa-circle" aria-hidden="true"></i>
					</span>
				</div>
				<!-- end_feed_comment_audio_bottom -->

                <!-- begin_blog_post_comment_bottom_drawer -->
                <div id="blog_post_comment_bottom_drawer" onclick="ImageDrawer.show(this, 'blog_post_comment_bottom_drawer')" class="wall_comment_smile_btn icon_drawer">
                    <i class="fa fa-pencil-square" aria-hidden="true"></i>
                </div>
                <!-- end_blog_post_comment_bottom_drawer -->

				<div id="blogs_post_comment_bottom_upload_img" class="comment_upload_img disabled">
					<div id="blogs_post_comment_bottom_upload_img_loader" class="comment_upload_img_loader"></div>

					<button id="blogs_post_comment_bottom_upload_img_edit" onclick="openEditorCommentUploadImage('blogs_post_comment_bottom_upload_img'); return false;" title="{a_edit_image}" class="btn btn-success comment_upload_img_editor">
							<span class="btn_wrap">
							<span class="icon_fa"  data-no-fade-in="true">
								<svg height="24" width="24" viewBox="0 0 24 24">
									<path d="M17.484 12c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM14.484 8.016c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM9.516 8.016c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM6.516 12c0.844 0 1.5-0.656 1.5-1.5s-0.656-1.5-1.5-1.5-1.5 0.656-1.5 1.5 0.656 1.5 1.5 1.5zM12 3c4.969 0 9 3.609 9 8.016 0 2.766-2.25 4.969-5.016 4.969h-1.734c-0.844 0-1.5 0.656-1.5 1.5 0 0.375 0.141 0.703 0.375 0.984s0.375 0.656 0.375 1.031c0 0.844-0.656 1.5-1.5 1.5-4.969 0-9-4.031-9-9s4.031-9 9-9z"></path>
								</svg>
							</span>
						</span>
					</button>
					<script>initCommentUploadImageEditor($('#blogs_post_comment_bottom_upload_img_edit'));</script>

					<i class="fa fa-camera" onclick="clearCommentUploadImage('blogs_post_comment_bottom_upload_img', true, true, event);" title="{a_upload_image}" aria-hidden="true"></i>

					<span class="count_upload_image">
						<i class="fa fa-check" aria-hidden="true"></i>
						<i class="fa fa-times" aria-hidden="true"></i>
					</span>

					<form id="blogs_post_comment_bottom_upload_img_frm" method="post" enctype="multipart/form-data" action="" onsubmit="return false;">
						<input class="comment_upload_img_input_file" type="file" accept="image/jpg,image/jpeg,image/png,image/gif" name="file_add_wall_{id}" onclick="clickCommentUploadImage($(this));" onChange="changeCommentUploadImage($(this));"/>
						<input class="inp_hide" type="reset" value=""/>
						<input class="inp_hide" type="submit" value=""/>
					</form>
					<script>initCommentUploadImage('blogs_post_comment_bottom_upload_img');</script>
				</div>
				<button class="wall_post_send">
					<svg viewBox="0 0 24 24">
						<path d="M21.5,11.1l-17.9-9C2.7,1.7,1.7,2.5,2.1,3.4l2.5,6.7L16,12L4.6,13.9l-2.5,6.7c-0.3,0.9,0.6,1.7,1.5,1.2l17.9-9   C22.2,12.5,22.2,11.5,21.5,11.1z" />
					</svg>
				</button>
			</div>
			<script>clBlogs.initFeedComment('#blogs_post_comment_bottom_{post_id}');</script>
        </div>
    </div>
</div>
<!-- end_blog_post_comments_enabled -->