Thứ Năm, 18 tháng 9, 2014

Tạo chữ Neon bằng Photoshop

Hiệu ứng đèn neon luôn được rất nhiều người ưa thích, đơn giản bởi sự bắt mắt và tinh tế của hiệu ứng này đặc biệt là với những ảnh có nền tối. Tuy nhiên để thành công với hiệu ứng này, bạn không cần phải biết quá nhiều kiến thức về Type Tool, mà bạn phải có một chút hiểu biết về vấn đề blend màu và đổ bóng. Và không thể thiếu công cụ chỉnh sửa ảnh hàng đầu – Photoshop. Hôm nay, tôi sẽ hướng dẫn các bạn cách tạo chữ Neon bằng Photoshop giúp các bạn học photoshop có thêm một lựa chọn hiệu ứng đẹp cho mình.
neon Tạo chữ Neon bằng Photoshop



Tạo chữ Neon bằng Photoshop như sau:





Bước 1: Bạn mở Photoshop lên. Tạo một file mới kích thước tùy ý, bạn hãy chọn màu nền là một màu tối để dễ nhận ra sự thay đổi trên nét chữ. Tốt nhất là bạn nên dùng màu đen #111111.
chuneon Tạo chữ Neon bằng Photoshop

 

Bước 2: Gõ chữ bạn cần vào, màu chữ là màu trắng. Bạn nhân đôi layer này lên và tắt layer chữ gốc đi.
chuneon2 Tạo chữ Neon bằng Photoshop
 


Bước 3: Chọn layer chữ không bị ẩn, vào mục Blending Option (Layer > Layer Style > Blending Option) chọn GradientOverlay. Ở Blend Mode bạn chọn Normal, 60% Opacity. Ở phần màu của Gradient, bạn cho bốn màu đỏ, vàng, xanh lá và xanh dương.
chuneon3 Tạo chữ Neon bằng Photoshop
 


Bước 4: Tiếp theo chúng ta sẽ làm mờ chữ với Gaussian Blur (Filter > Blur > Gaussiam Blur) với Radius khoảng 4 pixel.
chuneon4 Tạo chữ Neon bằng Photoshop

 

Bạn cho hiện layer chữ được ẩn lúc đầu lên, tiếp tục dùng Gaussian Blur cho layer này nhưng chỉ cần 1 pixel cho Radius.chuneon5 Tạo chữ Neon bằng Photoshop
 


Bước 5: Vào Layer > Layer Style > Blending Options. Tại bảng này, bạn cho Fill Opacity bằng 0. Sau đó chọn Outer Glow, dùng blend mode là Color Dodge, Opacity 50% màu trắng và size là 18. Sau đó bạn chọn Color Overlay và chọn màu trắng.
chuneon6 Tạo chữ Neon bằng Photoshop

 

Sau khi chỉnh Blending Option xong, bạn cho layer vừa chỉnh mode màu là Color Dodge. Và chúng ta đã hoàn thành.
chuneon9 Tạo chữ Neon bằng Photoshop
 
 

Với cách thực hiện như trên, phần chữ của bạn có thể phù hợp với khá nhiều loại nền khác nhau, đặc biệt là nền màu tối. Nếu cần bạn có thể thay đổi đôi chút ở phần Opacity cho phù hợp với nền. Chúc bạn thành công!

Các thành phần chính trong Drupal

Khi mới bắt đầu theo học Drupal các bạn cần tìm hiểu khái niệm của những thành phần có trong nó. Để có một cái nhìn tổng quan nhất về những gì mình cần phải tìm hiểu tiếp theo. Dưới đây là một số khái niệm cơ bản trong Drupal:
Module
Module là phần mềm (mã) mở rộng các tính năng Drupal và/hoặc các chức năng. Các module core được tích hợp trong bộ tải về của Drupal, và bạn có thể bật chức năng của của nó mà không cần cài đặt phần mềm bổ sung. Các module đóng góp được tải về trong mục download các module của drupal.org, và cài đặt trong thư mục cài đặt Drupal của bạn. Bạn cũng có thể tạo ra các module riêng của bạn, điều này đòi hỏi một sự hiểu biết thấu đáo về Drupal, lập trình PHP, và các module của Drupal API.
User, Permission, Role
Mỗi người truy cập vào trang web của bạn, cho dù họ có tài khoản và đăng nhập hoặc ghé thăm trang web nặc danh, được xem là một người sử dụng Drupal. Mỗi người sử dụng có số ID, và người người sử dụng không phải vô danh có tên người dùng và địa chỉ email. Các thông tin khác cũng có thể được liên kết với người sử dụng bởi các module, ví dụ, nếu bạn sử dụng các module Profile core, bạn có thể  định nghĩa thêm các trường trong profile người dùng.
Người dùng vô danh có ID=0.  Người sử dụng có ID=1  là tài khoản người dùng bạn tạo ra khi bạn cài đặt Drupal và là người dùng đặc biệt có quyền làm mọi thứ trên trang web.
Những người dùng khác được gán quyền thông qua Role
Node
Một Node trong Drupal là một thuật ngữ chung cho một phần của nội dung trên trang web của bạn. (Lưu ý rằng sự từ  "Node" không phải là từ có ý nghĩa trong toán học như một phần của mạng.) Một số ví dụ về các Node:
•        Các trang của các quyển sách(Pages in books)
•        Các chủ đề thảo luận trong diễn đàn (Discussion topics in forums)
•        Các trang trong blog(Entries in blogs)
•        Các bài viết tin tức (News article stories)
Mỗi Node trên trang web của bạn có một kiểu nội dung (Content type). Nó cũng có ID, Tiêu đề, Ngày viết, Tác giả (một người dùng trên trang web), Nội dung…. Bằng cách sử dụng Module (CCK).
Comment
Comment cũng là một loại nội dung bạn có thể có trên trang web của bạn (nếu bạn đã kích hoạt module comment ). Mỗi comment gắn với một Node cụ thể.
Taxonomy
Drupal có một hệ thống phân loại nội dung, mà được gọi là Taxonomy. Bạn có thể định nghĩa từ vựng của riêng bạn (vocabularies – groups of taxonomy terms), và thêm terms cho mỗi từ vựng. Từ vựng có thể là ngang hàng hoặc phân cấp, có thể cho phép lựa chọn một hoặc nhiều, và cũng có thể được "free tagging" (có nghĩa là khi tạo hoặc chỉnh sửa nội dung, bạn có thể thêm terms mới). Mỗi từ vựng có thể được gắn với một hoặc nhiều loại nội dung, và theo cách này, các Node trên trang web của bạn có thể được nhóm lại thành các loại, được dán nhãn, hoặc được phân loại trong bất kỳ cách nào bạn chọn.
Database
Drupal lưu trữ thông tin trong cơ sở dữ liệu, mỗi loại thông tin có bảng cơ sở dữ liệu riêng của mình. Ví dụ, các thông tin cơ bản về các Node  trên trang web của bạn được lưu trữ trong bảng Node, và nếu bạn sử dụng module CCK để thêm các trường vào các Node của bạn, nó được lưu trữ trong các bảng riêng biệt. Comment và User cũng có các bảng cơ sở dữ liệu riêng của nó, và Role, Permission, và các thiết lập khác cũng được lưu trữ trong các bảng cơ sở dữ liệu.
Path
Khi bạn truy cập một địa chỉ URL trong trang web của Drupal của bạn, một phần của địa chỉ URL sau địa chỉ cơ bản của trang web được gọi là Path.
Theme
Theme điều khiển cách trang web của bạn được hiển thị, bao gồm giao diện đồ họa, bố trí, và màu sắc. Theme bao gồm một hay nhiều tập tin PHP để xác định đầu ra HTML của các trang web của bạn, cùng với một hoặc nhiều file CSS để xác định bố trí, phông chữ, màu sắc, và phong cách khác.
Region, Block, Menu
Các trang trên trang web của Drupal của bạn được đặt ra trong Region, mà có thể bao gồm các header, footer, sidebars, và phần nội dung chính, theme của bạn có thể xác định các Region khác. Ngăn chặn được các đoạn rời rạc của thông tin được hiển thị ở Region của các trang web. Block có thể mang hình thức của menu (trong đó có liên quan với điều hướng trang web), nội dung từ các module (ví dụ, các chủ đề diễn đàn nóng), hoặc các khối thông tin tĩnh hoặc động mà bạn đã tạo ra cho mình (ví dụ, một danh sách các sự kiện sắp tới) .
Có 3 loại menu trong Drupal:  Primary Links, Secondary Links, and Navigation.
Hãy tham gia test kiên thức lập trình web để biết bạn đã học được những gì.

Tạo menu động lấy từ Database trong asp.net

Trong khi học lập trình ASP.net ta có thể tạo menu đa cấp hoặc tạo một menu động để sử dụng. bài viết này, bạn sẽ học được cách tạo menu động lấy dữ liệu từ database trong asp.net
I. Introduction
dynamically populationg menu
II. Create Database Tables
Bạn cần thiết kế một bảng để lưu trữ menu
database of menu
Ở đây, MenuLocation là cột dùng để lưu trữ đường dẫn tương đối khi mà người dùng click chuột vào.
Chèn dữ liệu mẫu vào nào:
B1: Cần phải có một vài menu với ParentId = 0, tức là menu cha đó.
B2: Thêm các sub menu cho các menu bên trên.
Ok!, sau khi thêm chúng ta sẽ được như sau:
?
1
2
3
4
5
6
7
MenuID  MenuName    MenuLocation ParentID
  1 ParentItem1 NULL       0
  2 ParentItem2 NULL       0
  3 ParentItem3 NULL       0
 11 SubMenuItem1    NULL       1
 12 SubMenuItem2    NULL       1
 21 SubMenuItem3    NULL       2
Ở đây, cột MenuLocation bạn có thể thêm url ví dụ như Default.aspx hoặc User/NewUserAdd.aspx
III. MasterPage
Thông thường khi chúng ta thiết kế menu, thì chúng ta thường chèn nó vào file MasterPage để chúng ta đỡ phải thiết kế nhiều lần,
B1: Tạo một menu control trong file MasterPage:
?
1
2
3
4
5
6
7
8
9
10
11
<div class="MenuBar">
    <asp:Menu ID="menuBar" runat="server" Orientation="Horizontal" Width="100%">
        <DynamicHoverStyle CssClass="DynamicHover" />
        <DynamicMenuItemStyle CssClass="DynamicMenuItem" />
        <DynamicSelectedStyle CssClass="DynamicHover" />
 
        <StaticHoverStyle CssClass="staticHover" />
        <StaticMenuItemStyle CssClass="StaticMenuItem" ItemSpacing="1px" />
        <StaticSelectedStyle CssClass="staticHover" />
    </asp:Menu>
</div>
B2: Trong code behind chúng ta viết thêm một hàm getMenu để lấy ra toàn bộ menu từ database, hàm này sẽ được dùng trong hàm Page_Load của trang MasterPage khi !IsPostBack
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
private void getMenu()
{
    Connect();
    con.Open();
    DataSet ds = new DataSet();
    DataTable dt = new DataTable();
    string sql = "Select * from tbl_WebMenu";
    SqlDataAdapter da = new SqlDataAdapter(sql, con);
    da.Fill(ds);
    dt = ds.Tables[0];
    DataRow[] drowpar = dt.Select("ParentID=" + 0);
 
    foreach (DataRow dr in drowpar)
    {
        menuBar.Items.Add(new MenuItem(dr["MenuName"].ToString(),
                dr["MenuID"].ToString(), "",
                dr["MenuLocation"].ToString()));
    }
 
    foreach (DataRow dr in dt.Select("ParentID >" + 0))
    {
        MenuItem mnu = new MenuItem(dr["MenuName"].ToString(),
                       dr["MenuID"].ToString(),
                       "", dr["MenuLocation"].ToString());
        menuBar.FindItem(dr["ParentID"].ToString()).ChildItems.Add(mnu);
    }
    con.Close();
}
IV. Chú ý quan trọng
Menu control này sẽ hoạt động không tốt đối với một số trình duyệt khác nhau, cho nên để giải quyết vấn đề này, bạn thêm một file .browser trong thư mục App_browser của bạn
browser
Sau đó mở file safari.browser ra, xóa sạch code trong đó, và thêm đoạn code sau vào:
?
1
2
3
4
5
6
7
<browsers>
  <browser refID="safari1plus">
    <controlAdapters>
      <adapter controlType="System.<span class="u3j7fbyb" id="u3j7fbyb_2" style="font-weight: bold; height: 12px;">Web</span>.UI.WebControls.Menu" adapterType="" />
    </controlAdapters>
  </browser>
</browsers>
Save nó lại và chiêm ngưỡng thành quả nào.
Bạn nào không làm được thì có thể download mã nguồn bài viết dưới đây nhé!