WordPress #16: Text

Nội dung

  1. Màu nền cho đoạn
  2. Màu nền cho kí tự
  3. Đường kẻ ở trên chữ
  4. Chữ ở phía trên (mũ)
  5. Chữ ở phía dưới
  6. Đổi cỡ chữ
  7. Đổi font chữ
  8. Tạo đường kẻ ngang
  9. Tạo thông tin thêm cho kí tự

Viết nốt cái bài đã đặt cọc từ khi bắt đầu lập cái page Mẹo WordPress cho đến giờ :”>
Nội dung bài này sẽ là những gì bạn có thể làm được với text, tức là chỉnh sửa font, cỡ chữ, vân vân và vân vân… ^^

Với mỗi mục sẽ có tên, code và ví dụ cụ thể ^^
Tất cả đều phải được viết trong chế độ HTML.
Nội dung không được sắp xếp theo thứ tự gì hết thế nên để dễ cho các bạn, mình sẽ xếp cái list ngay bên cạnh để các bạn tiện xem. Nếu sau này có thêm cái gì thì mình sẽ post luôn vào bài này luôn. Thế nên phần nào viết ở dưới tức là được viết sau.

Những điều cần biết trước khi xem bài này

  • Màu sử dụng trong code HTML là mã màu hex. Để biết được mã hex cho mỗi màu, các bạn chọn dấu mũi tên cạnh hình chữ A trong thanh công cụ trên WordPress, chọn More colors, copy mã trong ô Color
  • Code span dùng cho từ/cụm từ trong một đoạn, p cho cả đoạn, div cho nhiều đoạn hoặc cả bài.
  • Để áp dụng nhiều thuộc tính cho một đoạn, hãy gộp nó lại trong cùng một thẻ.

Màu nền cho đoạn

Cái này thích hợp khi viết sì poi, tức là khi đó, người đọc phải bôi đen mới có thể đọc được. Nên để màu chữ trùng với màu nền

<div style="padding: 12px; background-color: #mã hex; line-height: 1.4;">ĐOẠN</div>

Ví dụ:

<div style="padding: 12px; background-color: #8ff9eb; line-height: 1.4;">Đây là một đoạn văn ví dụ.</div>

Kết quả:

Đây là một đoạn văn ví dụ.

Màu nền cho kí tự

<span style="background-color: #mã hex;">KÍ TỰ</span>

Ví dụ:

Đây là một đoạn văn <span style="background-color: #8ff9eb;">ví dụ</span>.

Kết quả:
Đây là một đoạn văn ví dụ.

Đường kẻ ở trên chữ

<span style="text-decoration: overline;">KÍ TỰ</span>

Ví dụ:

Đây là một đoạn văn <span style="text-decoration: overline;">ví dụ</span>.

Kết quả:
Đây là một đoạn văn ví dụ.

Chữ ở phía trên (mũ)

<sup>KÍ TỰ</sup>

Ví dụ:

Đây là một đoạn văn <sup>ví dụ</sup>.

Kết quả:
Đây là một đoạn văn ví dụ.

Chữ ở phía dưới

<sub>KÍ TỰ</sub>

Ví dụ:

Đây là một đoạn văn <sub>ví dụ</sub>.

Kết quả:

Đây là một đoạn văn ví dụ.

Đổi cỡ chữ

<span style="font-size:100%;">KÍ TỰ</span>

Ví dụ:

Đây là một đoạn văn <span style="font-size:200%;">ví dụ</span>.

Kết quả:

Đây là một đoạn văn ví dụ.

Đổi font chữ

Về lý thuyết thì bạn có thể để bất cứ font nào mà bạn muốn, nhưng chỉ máy nào có cài font đó thì mới hiện ra được thôi. Vì vậy, để an toàn, hãy chỉ dùng những font mà Windows có sẵn. Đó là:
Arial
Arial Black
Comic Sans MS
Courier New
Georgia
Impact
Lucida Console
Lucida Sans Unicode
Palatino Linotype
Tahoma
Times New Roman
Trebuchet MS
Verdana

<span style="font-family:TÊN FONT;">KÍ TỰ</span>

Ví dụ:

Đây là một đoạn văn <span style="font-family:Palatino Linotype;">ví dụ</span>.

Kết quả:

Đây là một đoạn văn ví dụ.

Tạo đường kẻ ngang

<hr />

Ví dụ:

Đây là một đoạn văn ví dụ.
<hr />
Đây là một đoạn văn ví dụ.

Kết quả:

Đây là một đoạn văn ví dụ.


Đây là một đoạn văn ví dụ.

Tạo thông tin thêm cho kí tự

Cái này tức là khi di chuyển vào một kí tự, một dòng giải thích/thông tin thêm cho kí tự đó sẽ hiện ra.
Cũng có thể sử dụng nó như một hình thức spoiler cho truyện, yêu cầu người xem phải di chuyển chuột vào chỗ đó mới đọc được phần spoil ^^

<abbr title="THÔNG TIN THÊM">KÍ TỰ</abbr>

Ví dụ:

Đây là một đoạn văn <abbr title="Đây là một đoạn thông tin thêm.">ví dụ</abbr>.

Kết quả:

Đây là một đoạn văn ví dụ.

https://tieuxuyen.wordpress.com/meo-wordpress/

Một suy nghĩ 148 thoughts on “WordPress #16: Text

  1. Cảm ơn bạn rất nhiều. Mình mới hỏi hôm qua mà hôm nay bạn đã trả lời bằng một bài rất hoành tráng rùi :-))
    Chỉ là mình cảm thấy viết bằng HTML phiền quá đi, hehe. Đành tiết chế trong việc trình bày vậy.
    Mình search thấy có một số plug-in có thể chỉnh tùy chọn cho text nhưng cài vào không được. Sao vậy hả bạn?

    Liked by 1 person

  2. Chao em ,
    Vo tinh chi tim duoc website cua em khi search vao chu WordPress ..Trang Meo WordPress cua em rat la bo ich cho nhung nguoi dang thuc tap lam website nhu chi .. Em da bo rat nhieu thoi gian va rat nhiet tinh , giup do cac ban khi gap kho khan trong viec lam website ..Cho chi hoi em cai link website nay http://www.eva.vn/lam-dep/5-cong-thuc-lam-dep-hieu-qua-cho-ban-gai-c58a81755.html
    .Cai khung bai : 5 công thức làm đẹp hiệu quả cho bạn gái .. goi la sidebar ( giua ) phai khong em ?
    va cach lam nhu the nao , em co the cho chi cai code duoc khong de chi lam giong nhu vay ?
    chi dang xai WordPress ..them la kieu Suffusion …
    con 2 ben co nhung khung hinh Quang Cao , goi la sidebar right & left hay goi la cac cot : two-column and three-column width layouts….em cho chi biet nha , cam on em !
    Em co CODE de cai lich 2012 Calrndar khong ? em co the cho chi duoc khong ??
    Cam On em rat nhieu …va chuc em co mot ngay that vui ve , hanh phuc voi nhung gi em dang chia se nhung gi voi cac ban khap noi tren trang nay .. Chi My Huong

    Số lượt thích

    1. Chào chị,
      Em rất vui vì những gì mình viết có ích cho chị
      Về các nội dung chị, rất tiếc vì em không giúp gì được, vì những cái đấy thuộc về phần cài wp trên host riêng, mà em chỉ dùng phiên bản wp trên web nên không tìm hiểu gì về những cái đó
      Còn về lịch thì chị có thể tham khảo các kiểu lịch và hướng dẫn trên trag web này
      Hi vọng giúp được cho chị
      Thân.

      Số lượt thích

  3. Chi cam on em da bo thoi gian tra loi cac cau hoi giup chi va cac ban khac … chi da copy code cua lich vao trang website duoc roi ..Mot lan nua ” Cam On Co Be ” that de thuong qua !
    Chuc em co mot tuan le vui ve & may man nhe !
    Chi se thuong xuyen vao trang nay cua em ..
    Chi My Huong…

    Số lượt thích

  4. Chào bạn, cho mình hỏi chút.
    Mình muốn vừa chỉnh cỡ chữ vừa font chữ một lúc thì làm thế nào. Mình đã thử kết hợp hai cái với nhau những không được. Như thế này bạn:

    Gặp em.
    Mong bạn giúp đỡ ^^ Cảm ơn rất nhiều

    Số lượt thích

    1. chị đã ghi ở phần trên là

      Code span dùng cho từ/cụm từ trong một đoạn, p cho cả đoạn, div cho nhiều đoạn hoặc cả bài.

      vậy với đoạn em thay chữ các chỗ có chữ span trong code thành p hoặc div là được

      Số lượt thích

  5. Sis ơi, cho em hỏi, em mới đăng kí WP đầu năm nay. Lúc e viết bài mới thì ko có chế độ chỉnh màu chữ? Giờ e ko biết làm thế nào để chữ có màu được, chỉ toàn để chữ đen thôi. :((. Sis giúp e với.

    Số lượt thích

  6. Bạn ơi cho mình hỏi, nếu như chỉnh font chữ trong wordpress thì nên để font chữ gì cho dễ đọc? Các font chữ có sẵn trong wordpress thôi ấy.

    Cho mình hỏi thêm font chữ nhà bạn là font chữ gì vậy?

    Số lượt thích

  7. *gãi đầu* thật là ngại quá, bạn cho mình hỏi là ko pik tại sao mình ko đổi font chữ đc, nó cứ hiện ra cái đoạn code thui :(
    hay là phải cài đặt gì ko hả bạn ^^
    mong tin bạn … cảm ơn bạn nhé, blog rất hay :X

    Số lượt thích

      1. à, mình làm đc rùi, cảm ơn bạn nhìu lắm ^^
        bạn cho mình hỏi chuyện này nữa ^^ mình đã tạo đc mục lục rùi, cũng đã thêm vài thư mục con trog đó, nay cũng làm như bình thường nhưng cuối bài nó ko hiện lên cái mục lục để mình chọn nữa, nên bài đó nó vẫn ở trag chủ ko đưa vào mục lục đc, cho mình hỏi là tại sao vậy

        Số lượt thích

          1. à, *gãi đầu* mình ko pik nói sao nữa, để mình nói thế này thử xem bạn hỉu ko nhé ^^
            bạn vào wp của mình xem thử nha, mình mún đăng cái show ảnh vào trog mục thư viện ảnh đấy, vẫn làm bình thường như lúc trước, đến lúc dắp đăng bài nó ko hiện ra thư mục mẹ, hay thư mục con … nên mình ko đưa cái show ảnh đó vào thư viện ảnh đc

            Số lượt thích

                  1. à, bạn hiểu nhầm ý mình rùi ^^
                    hi hi, nhưng mình đã sửa lại đc rùi, cảm ơn bạn đã bỏ thời gian đọc mấy comt nhảm của mình nhé
                    cảm ơn bạn nhìu lắm, ngày lành :X
                    p.s : lần sau nếu có gì ko hiểu, mình lại hỏi bạn nhé, bạn chỉ rất dễ hiểu xDD~

                    Số lượt thích

  8. Bạn ơi, cho mình hỏi về cách viết bài được không? Nếu mình post một bài thật dài thì làm sao để đổi font chữ , font màu của quyên bài đó. Mỗi lần mình viết phải đổi từng dòng, hảo mệt T^T có cách nào đổi luôn quyên bài mà không phải đổi từng dòng không? Mình cũng xài wordpress như bạn vậy :D

    Số lượt thích

    1. Ở ngay đầu bài mình đã viết

      Code span dùng cho từ/cụm từ trong một đoạn, p cho cả đoạn, div cho nhiều đoạn hoặc cả bài.

      Vậy nếu bạn muốn dùng cho cả bài thì bạn thay các chỗ có chữ span thành chữ div là được.

      Số lượt thích

  9. Bạn ơi, mình hơi thắc mắc một chút, mình muốn chỉnh màu chữ trên widget, mình đã đọc các giải đáp bên trên của bạn nhưng trong phần post, ko biết máy mình cùi bắp hay làm sao nhưng không có phần chỉnh màu bạn ạ, cụ thể thì nó như thế này :3 :3

    Bạn có thể giúp mình được không :3

    Số lượt thích

  10. bạn ơi cho mình hỏi, nếu trong một câu/dòng mà cần vừa đổi font, vừa đổi size thì làm sao? màu chữ nữa,
    còn một câu nữa mình muốn nhờ bạn chỉ giáo, đó là mình cứ phải cop cả đoạn code vào từng dòng ý, có cách nào khác ko

    Số lượt thích

    1. ở trên đầu bài viết mình đã ghi rất rõ

      Code span dùng cho từ/cụm từ trong một đoạn, p cho cả đoạn, div cho nhiều đoạn hoặc cả bài.
      Để áp dụng nhiều thuộc tính cho một đoạn, hãy gộp nó lại trong cùng một thẻ.

      bạn cứ làm đúng như vậy là được

      Số lượt thích

  11. b ơi cho mình hỏi, có thể đổi màu chữ tất cả các post cùng một lúc k? tại mỗi lần mình đổi background là màu chữ cũ lại nhìn k rõ, nếu vào từng post chỉnh thì chả hiểu bh mới xong T^T

    Số lượt thích

    1. không có cách nào đâu bạn ạ
      vậy nên tốt nhất là bạn để màu nguyên gốc của wp, rồi sau này có đổi background thì cũng chọn background nào cho màu chữ có sẵn dễ nhìn thôi

      Số lượt thích

    1. chị cũng chưa hiểu sao nó lại bị thế nữa
      nhưng chị đoán là do bài viết đó của em đang để ở chế độ Aside
      em thử đổi lại post format sang bình hường xem thế nào nhé

      Số lượt thích

  12. chào bạn! Mình có 2 vấn đề muốn hỏi bạn
    1/ Mình ko hiểu cái Widget chuyên mục đó có tác dụng gì, nói chung là mình chưa hiểu lắm về nó, bạn có thể giải thích giúp mình ko? Mình vào trong phần cái đặt thì thấy có báo là chuyển đổi chuyên mục thành tag, mình hơi lúng túng chỗ này. Mong bạn giúp đỡ
    2/ Có cách nào đổi font và cỡ chữ cho cả themes không? mình thấy thật là khó khăn khi cứ mỗi lần viêt bài là lại mỗi lần chèn code font
    Cảm ơn bạn

    Liked by 1 person

    1. 1/ widget chuyên mục là widget hiển thị các chuyên mục (category) trong wp, có thể hiểu chuyên mục như folder, trong đó chứa các bài viết vậy
      tag có thể hiểu là các từ khóa trong bài viết
      2/ ko bạn ạ, trừ phi bạn dùng custom upgrade (mất phí)

      Liked by 1 person

          1. Chào bạn!
            Cho mình hỏi thêm cái này nữa!
            Nếu mình muốn chia wp của mình thành nhiều trang thì mình phải làm thế nào? vì bài viêt thì quá nhiều mà nó cữ nằm 1 trang thì dài quá
            Nhờ bạn giúp đỡ
            Xin cảm ơn

            Số lượt thích

              1. Hình như bạn hiểu ko đúng ý mình, ý của mình là ví dụ trang wp của mình hiện tại có 6 bài viết, nó hơi dài nên mình muốn phân mỗi trang có 3 bài viết thôi. Mong bạn giúp đỡ. Xin cảm ơn

                Số lượt thích

                    1. ý mình là,ví dụ: ngày hôm qua mình viết 1 bài đăng lên rồi với tiêu đề là A, hôm nay mình lại muốn đăng y chang bài hôm qua nhưng lấy tiêu đề là B, thì mình phải làm sao

                      Số lượt thích

  13. cậu ơi tớ muốn hỏi, tớ vào phần Customize của blog đển chỉnh font chữ mà chỉnh xong nó chẳng thay đổi gì cả, có mẹo nào không cậu?

    Số lượt thích

    1. a, tớ đã đọc lại rồi, về font chữ chắc là do tớ chọn cái Windows không có, nhưng muốn thắc mắc thêm nữa.
      tại sao trong khi edit đã chú ý để phần trống rất lớn giữa ảnh đi kèm và dòng chữ ở ngay sau nó mà khi edit xong, ra xem nó vẫn dính sát vào nhau trông rất không đẹp?

      Số lượt thích

  14. mình ko thay đổi đc màu font của toàn blog hả bạn ? Trong mục tùy chỉnh giao diện,có phần color & backgrounds. Đổi cái đó là đi cả trang, ko riêng gì màu font =.= Mình chỉ muốn đổi mau cho font thui à, có cách nào ko chủ nhà, bạn vào nhà mình xem thử, màu font hơi khó nhìn phải ko, còn cái header đầu trang màu nâu nhìn kinh kinh ==” đổi luôn dc ko chủ nhà, híc

    Số lượt thích

  15. (⁀‵⁀) ✫ ✫ ✫. Gia chủ Neko tạc mao`⋎´✫¸.•°*”˜˜”*°•✫ ..✫¸.•°*”˜˜”*°•.✫ nói:

    khi không tớ bị mất Tab ngang chỉnh màu chữ trong bài Post rồi :(, Khi vào viết bài ở hai cách ( nhấn vào + phía trên tay phải hoặc là viết ở mục bài viết ) đều bị mất tab đó :( có cách nào kêu nó quay về không chủ nhà.

    Số lượt thích

  16. Em không làm được ss ơi! lúc em chỉnh màu trong một bài viết bình thường xong copy rồi pater qua Widget nó vẫn không có màu. Ss giúp em với

    Số lượt thích

      1. Em không gửi ảnh chụp widget của em qua cmt được chị ơi T_T Em làm theo như chị. Viết trong một bài chỉnh sửa bình thường xong rồi em paste qua Widget mà em vẫn không thấy màu. Chị giúp em nhé em cảm ơn chị nhiều :(

        Số lượt thích

  17. Cảm ơn chị nhiều lắm. Nhờ cái tận tình của chị mà em làm được rồi. Ban đầu em bị bất lực luôn T^T Nhưng mà nhờ có chị chỉ phải chuyển sang chế độ văn bản nên em làm được rồi ^^ Cảm ơn chị ngàn lần luôn ^_^ Mà cho em hỏi cái nha :D Chị là Hủ Nữ hay sao vậy ạ <3

    Số lượt thích

  18. Dù sao cũng cảm ơn chị nhiều lắm ^^ Em là hủ nữ :p không ngờ tìm được cái blog này vừa được chị chỉ nhiều cái mà còn được đọc đam nữa :D Kamsamita chị nhiều nhiều

    Số lượt thích

  19. Mình cảm ơn bài viết của bạn trước, và có 1 vấn đề muốn hỏi như sau: Mình sử dụng theme sorbet, lúc đầu font chữ của theme này mình không thích lắm nên trong phần tùy chỉnh mình đã điều chỉnh lại font chữ, nhưng không hiểu sao mấy hôm nay font chữ của wp lại về cái font ban đầu của theme, bạn có thể giúp mình được không?

    Số lượt thích

    1. a e còn 1 thắc mắc nữa là nếu dùng với cả 1 đoạn truyện dài thì sao ạ, e dùng nhug nó ko đc liên hết cả ạ, xuống đoạn là lại như bt. Làm tnao bjo ss

      Số lượt thích

            1. mà tỷ ơi làm tn để có thể ghim 1 bài đứng im đầu trang được ạ, kiểu nó là about hay profile mà mình ko muốn nó bị di chuyển xuống khi có new post ý ạ

              Số lượt thích

  20. Yappa cho mình hỏi, dạo gần đây mình up bài mới thì hay bị như thế này, chỗ đậm chỗ nhạt, chỉ có mấy bài gần đây mới bị thôi, có cách nào để khắc phục ko nhỉ?

    Số lượt thích

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google photo

Bạn đang bình luận bằng tài khoản Google Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

Connecting to %s