diff --git a/src/EasyAbp.EasyComment.Application.Contracts/Comments/Dtos/CommentDto.cs b/src/EasyAbp.EasyComment.Application.Contracts/Comments/Dtos/CommentDto.cs
index 650c513..2cd569c 100644
--- a/src/EasyAbp.EasyComment.Application.Contracts/Comments/Dtos/CommentDto.cs
+++ b/src/EasyAbp.EasyComment.Application.Contracts/Comments/Dtos/CommentDto.cs
@@ -13,5 +13,7 @@ public class CommentDto : FullAuditedEntityDto<Guid>
         public string Content { get; set; }
 
         public Guid? ReplyTo { get; set; }
+        
+        public string CreatorName { get; set; }
     }
 }
\ No newline at end of file
diff --git a/src/EasyAbp.EasyComment.Application/Comments/CommentAppService.cs b/src/EasyAbp.EasyComment.Application/Comments/CommentAppService.cs
index 3554b6a..c8b56b8 100644
--- a/src/EasyAbp.EasyComment.Application/Comments/CommentAppService.cs
+++ b/src/EasyAbp.EasyComment.Application/Comments/CommentAppService.cs
@@ -6,6 +6,7 @@
 using Microsoft.AspNetCore.Authorization;
 using Volo.Abp;
 using Volo.Abp.Application.Services;
+using Volo.Abp.Threading;
 using Volo.Abp.Users;
 
 namespace EasyAbp.EasyComment.Comments
@@ -17,10 +18,12 @@ public class CommentAppService : CrudAppService<Comment, CommentDto, Guid, GetLi
         protected override string UpdatePolicyName { get; set; } = EasyCommentPermissions.Comment.Update;
         protected override string DeletePolicyName { get; set; } = EasyCommentPermissions.Comment.Delete;
         private readonly ICommentRepository _repository;
+        private readonly IExternalUserLookupServiceProvider _userLookupServiceProvider;
 
-        public CommentAppService(ICommentRepository repository) : base(repository)
+        public CommentAppService(ICommentRepository repository, IExternalUserLookupServiceProvider userLookupServiceProvider) : base(repository)
         {
             _repository = repository;
+            _userLookupServiceProvider = userLookupServiceProvider;
         }
 
         protected override IQueryable<Comment> CreateFilteredQuery(GetListInput input)
@@ -43,6 +46,15 @@ protected override IQueryable<Comment> ApplySorting(IQueryable<Comment> query, G
             }
         }
 
+        protected override CommentDto MapToGetListOutputDto(Comment entity)
+        {
+            var dto = base.MapToGetListOutputDto(entity);
+            var creator = AsyncHelper.RunSync(() => _userLookupServiceProvider.FindByIdAsync(entity.CreatorId.GetValueOrDefault()));
+            dto.CreatorName = creator.Name;
+
+            return dto;
+        }
+
         [Authorize]
         public virtual async Task<CommentDto> UpdateContentAsync(UpdateContentInput input)
         {
diff --git a/src/EasyAbp.EasyComment.Application/EasyAbp.EasyComment.Application.csproj b/src/EasyAbp.EasyComment.Application/EasyAbp.EasyComment.Application.csproj
index c69f19a..e5109a1 100644
--- a/src/EasyAbp.EasyComment.Application/EasyAbp.EasyComment.Application.csproj
+++ b/src/EasyAbp.EasyComment.Application/EasyAbp.EasyComment.Application.csproj
@@ -10,6 +10,7 @@
   <ItemGroup>
     <PackageReference Include="Volo.Abp.AutoMapper" Version="2.9.0" />
     <PackageReference Include="Volo.Abp.Ddd.Application" Version="2.9.0" />
+    <PackageReference Include="Volo.Abp.Users.Abstractions" Version="2.9.0" />
     <ProjectReference Include="..\EasyAbp.EasyComment.Application.Contracts\EasyAbp.EasyComment.Application.Contracts.csproj" />
     <ProjectReference Include="..\EasyAbp.EasyComment.Domain\EasyAbp.EasyComment.Domain.csproj" />
   </ItemGroup>
diff --git a/src/EasyAbp.EasyComment.Application/EasyCommentApplicationAutoMapperProfile.cs b/src/EasyAbp.EasyComment.Application/EasyCommentApplicationAutoMapperProfile.cs
index 030be33..0ed604c 100644
--- a/src/EasyAbp.EasyComment.Application/EasyCommentApplicationAutoMapperProfile.cs
+++ b/src/EasyAbp.EasyComment.Application/EasyCommentApplicationAutoMapperProfile.cs
@@ -11,7 +11,9 @@ public EasyCommentApplicationAutoMapperProfile()
             /* You can configure your AutoMapper mapping configuration here.
              * Alternatively, you can split your mapping configurations
              * into multiple profile classes for a better organization. */
-            CreateMap<Comment, CommentDto>();
+            CreateMap<Comment, CommentDto>()
+                .ForMember(dest => dest.CreatorName, opt => opt.Ignore())
+                ;
             CreateMap<CreateUpdateCommentDto, Comment>(MemberList.Source);
         }
     }
diff --git a/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.cshtml b/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.cshtml
index 8756520..5d343af 100644
--- a/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.cshtml
+++ b/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.cshtml
@@ -3,14 +3,21 @@
 @using Microsoft.AspNetCore.Mvc.Localization
 @inject IHtmlLocalizer<EasyCommentResource> L
 
-<div class="ec-comments">
-    <i class="fa fa-comments"> @L["TotalComments", Model.TotalCount]</i>
+<abp-container class="ec-comments">
+    <abp-row>
+        <i class="fa fa-comments"> @L["TotalComments", Model.TotalCount]</i>
+    </abp-row>
+    @{ int i = 1;}
     @foreach (CommentDto comment in Model.Items)
     {
         <abp-container class="ec-comment">
-            <abp-row>@comment.CreatorId @comment.CreationTime</abp-row>
-            <p>@comment.Content</p>
+            <abp-row>
+                <a class="ec-comment-link" href="#@comment.Id">#@(i++)</a>
+                <p class="ec-creator">@comment.CreatorName</p>
+                <span class="ec-comment-time">@comment.CreationTime</span>
+            </abp-row>
+            <p class="ec-content" id="@comment.Id">@comment.Content</p>
             <hr/>
         </abp-container>
     }
-</div>
\ No newline at end of file
+</abp-container>
\ No newline at end of file
diff --git a/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.css b/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.css
index 265b974..3f1f9a8 100644
--- a/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.css
+++ b/src/EasyAbp.EasyComment.Web/Pages/Components/CommentWidget/Default.css
@@ -1,3 +1,27 @@
 div.ec-comments {
     margin: 10px;
+}
+
+div.ec-comment {
+    margin: 10px;
+}
+
+div.ec-comment span {
+    margin-left: 5px;
+}
+
+a.ec-comment-link {
+    margin-right: 5px;
+}
+
+p.ec-creator {
+    font-weight: bold;
+}
+
+p.ec-content {
+    line-break: anywhere;
+}
+
+span.ec-comment-time {
+    color: gray;
 }
\ No newline at end of file