Skip navigation.

Log in | Sign up

Sign up | Lost password? | Help

TIPS AND TRICKS

http://www.duyhien.com

Test offline cho Skin của Blog Opera

Sunday, 11. March 2007, 06:55:55

,

Hồi mới học HTML, tôi cứ tưởng phải upload tất cả hình ảnh vào host thì mới xem được trang HTML Hậu quả là có một ngày bão tuyết, ở nhà thì wireless network không thể connect được, tôi đã phải lội bộ dưới trời tuyết dày đặc để đến trường. Cũng may tôi là Fulbright scholar nên security guard mới mở cửa cho tôi vào văn phòng

Khi bắt đầu mò mẫm cách trang trí Blog Opera, tôi đã có kinh nghiệm test offline các trang HTML Nhưng... sao không thể làm được Hậu quả là tôi phải đăng ký thêm một tài khoản ở Opera dùng để test skin mới hu hu... và tiền Internet tăng một cách chóng mặt (ba Đan Quỳnh cằn nhằn quá trời, nhưng nhờ vậy mà có lý do đổi package ).

Vừa rồi, Khánh Quang chỉ cho tôi biết lý do tôi không test offline cho skin Opera được Hì hì... mắc cỡ thiệt vì tôi đã từng edit một webset sử dụng CSS thành trang web của tôi mà Anyway, từ đây về sau sẽ không mất thời gian ngồi chờ connect to my opera và không tốn thêm nhiều tiền Internet (mặc dù bây giờ xài ít thì cũng trả bấy nhiêu rồi ).


* * *

Trước tiên, bạn tạo một folder trong ổ cứng của bạn. Tất cả các hình ảnh để trang trí cho blog của bạn đều được lưu trong folder này. Sau đó bạn dùng menu save as, hoặc save page as để lưu các trang HTML hiển thị blog của bạn vào folder vừa tạo, ví dụ trang blog, trang lưu trữ bài viết - Archive, trang hình ảnh - Photos,... Bạn cũng cần lưu file main.css vào folder này.



Tiếp theo, bạn mở các file HTML và tìm đoạn mã sau (nằm trong phần head):

<link rel="stylesheet" href="http://files.myopera.com/username/user.css" type="text/css" media="screen,projection,print" />
<link rel="stylesheet" href="/community/css/users/2/main.css" type="text/css" media="screen,projection,print" />


Lưu ý: username là tên của bạn, ví dụ của tôi là danquynh; số 2 tương ứng với theme mặc định mà bạn chọn để chỉnh sửa. Trường hợp bạn không sử dụng theme mặc định của Opera (có nghĩa là bạn lưu với option "only use my custom style sheet") thì bạn sẽ không thấy đoạn mã có chứa main.css trong các file HTML. Bạn cần chỉnh lại đoạn mã này như sau:

<link rel="stylesheet" href="user.css" type="text/css" media="screen,projection,print" />
<link rel="stylesheet" href="main.css" type="text/css" media="screen,projection,print" />


Có nghĩa là bạn bỏ đường dẫn cho hai file main.css và user.css.

Bạn mở notepad và gõ vào những đoạn mã mà bạn muốn thay đổi so với theme mặc định, như hình nền, banner, footer,... và save với tên là user.css.



Lưu ý trong file user.css này bạn cũng không chỉ đường dẫn cho các file hình ảnh, mà chỉ ghi tên hình ảnh thôi. Ví dụ, trong theme dành cho Blog Opera của bé, đoạn mã dành cho banner là:

#top2 {
BORDER-TOP: #555 1px solid;
PADDING-LEFT: 15px;
BACKGROUND: url(banner.gif) right top;
HEIGHT: 183px;
}


Khi đã hoàn tất file user.css, bạn mở các trang HTML bằng trình duyệt web để xem kết quả. Nếu đã vừa ý, bạn sẽ upload hình ảnh vào host (My Account/ Files) và thay đường dẫn (url) cho các file hình ảnh trong file user.css. Cuối cùng bạn paste toàn bộ nội dung của file user.css vào ô Enter CSS trong My Account/ Design/ Change Design.

Chúc bạn thành công!

Phá sảnTạo Skin cho Blog Opera từ theme Yahoo 360

Comments

xuanhau88 12. March 2007, 10:47

bóc tem cái đã hôm nào làm thử sau he he :D P:

forevermyweb 12. March 2007, 11:21

Cách này hay thiệt lúc trước em cũng có làm thử nhưng không được . Kể từ nay đỡ tốn tiền net rồi :D . À chị cho em hỏi bé mới sinh của chị tên gì nhỉ ... Nghe chị có em bé từ Tết mà chưa có dịp hỏi thăm..

snowmicky 14. March 2007, 10:57

đẹp thế anh cho em cái flie css của blog này đi! Y!m em là:nghiangominh

xuanhau88 14. March 2007, 11:07

đẹp thế anh cho em cái flie css của blog này đi! Y!m em là:nghiangominh


!?
sis Hien^` ma` kiu la` anh !?

danquynh 16. March 2007, 13:53

Em xuanhau88, lại bắt chước Yahoo rồi P:

Em forevermyweb, cám ơn em đã hỏi thăm, em bé sinh 14/2, nhưng bây giờ chưa đặt tên P:

Em snowmicky, chị có link download skin này mà :smile:

xuanhau88 27. March 2007, 17:53

chị ui , em nhờ chị làm giùm em 1 skin đc. ko
hom qua em lam` j` ko biết mà hỏng rồi
:frown: ╦

Dark_1010 28. March 2007, 03:15

Chị Lu dễ thương thật đấy, hôm nào gặp chị Lu được ko, em năm nay mới học lớp 10 thôi, nhưng thik gọi Lu là chị hơn (cho nó trẻ ấy mà). Em là dân mới vào làng blog thôi. Mong được làm quen với chị Lu và tất cả những người bạn ở đây.

danquynh 30. March 2007, 04:47

Welcome em Dark_1010 nhé. Em ở đâu? Khi nào em bé lớn thì chị em mình đi uống café nhé :smile:

luckystars 30. March 2007, 18:37

Xin thưa bà con, từ ngày Opera n6ang cấp giao diện blog lên... thì ko thể nào save as toàn bộ blog về để lấy các file .main.css.... nên khó lòng mà test skin hay chôm skin của thiên hạ đc nữa.
Vậy có cách nào save skin về ko....

danquynh 31. March 2007, 00:13

View source :wink:

luckystars 31. March 2007, 05:07

Cũng View source rùi đấy chứ, nhưng mò ko ra cái file main.ccs.... use.ccs đâu cả .Nhìn khi sao thấy các ttin trong các file đó út wa'. ko biết skin, themes... đủ ko nữa...Nên ko dám xài thử

danquynh 31. March 2007, 06:32

Bạn xem "FAQs về Blog Opera", câu hỏi số 20 :wink:

socnhonho 31. March 2007, 07:14

Trời, phải chi em đọc bài này sớm hơn nhỉ?Em đang thử Skin mới mà cuối cùng nó lộn tùng phèo hết trơn.Chán cái là liên tục bị tình trạng vô chưa được 3 phút đã down rồi. Em sẽ thử offline ở nhà. Cảm ơn chị nhiều.

Whitejasmine 1. April 2007, 01:57

Phải chi em đọc được bài này sớm hơn thì có lẽ đã không phải vất vả trong việc làm skin cho blog đến thế. Cứ mỗi lần thay đổi 1 cái gì đó là mỗi lần phải F5 để refresh trình duyệt. Cảm ơn chị vì tuyệt chiêu này :D

12GchuyenTB 8. April 2007, 16:21

Trời ui, chị mới gia nhập hacker mũ đen hay sao mà giao diện tối tăm thế này. Cái test offline của em dùng fire fox thì không cần phức tạp như chị bảo, chỉ cần save as toàn bộ trang web vào 1 thư mục, thay đổi nội dung trong main.css rồi chạy lại file có biểu tượng của fire fox là được.

danquynh 8. April 2007, 16:50

socnhonho và Whitejasmine đã làm thử chưa?

Em 12GchuyenTB, nếu em không thay đường dẫn trong các file HTML (là file có biểu tượng Fire Fox) thì làm sao offline được? p: Bài viết của chị chỉ đề cập mỗi trick đó thôi: thay đường dẫn cho main.css (hoặc user.css) và hình ảnh để không cần phải load từ host P: Btw, chị cũng sử dụng Fire Fox :D

Cái skin này chị làm dở từ trước khi sinh em bé :smile: Tính không làm tiếp nhưng tại nhiều người thích quá, với lại chị cũng thấy nó đẹp P:

echip 15. April 2007, 05:19

Skin đẹp dã man ha - ^_^

Whitejasmine 15. April 2007, 09:11

Hì, em chưa có dịp thử. Dạo này em chả có thời gian làm skin nữa nên em để skin mặc định luôn. Khi nào có thời gian em sẽ thử ^_^.

sinfirex 19. April 2007, 07:24

Nếu bạn save để sửa offline như vậy, sẽ ko thể save được images làm background của trang O_o Vì bản thân khi sử dụng lệnh "Save as" trên menu của trình duyệt nó đã save thiếu file rồi, vì vậy ko thể render ra 1 trang web chuẩn như trên mạng với số file bị thiếu đó.

danquynh 19. April 2007, 08:41

Echip, cám ơn em có lời khen :smile:

Whitejasmine, chị cũng tính hỏi em mấy lần vì vào blog của em toàn thấy skin mặc định :smile: Tính comment cái post có "chị Hiền", nhưng mà mới gõ được vài từ thì công chúa oe oe :frown:

Sinfirex, thế nên tớ mới nói là phải save tất cả các hình ảnh để hiển thị trên skin P: Nếu save as không được thì có thể view source để save mà :smile: Tuy nhiên, cũng có những hình ảnh không save được, ví dụ photo slide shows, avatars, spotlight images... Nhưng những hình ảnh đó thì cũng không cần thiết lắm, có frame là canh được rồi. Nói chung là tớ test offline (không cần connect internet) cho cả skin sử dụng hoàn toàn my CSS, và combine với theme mặc định. And it works very well P:

sinfirex 19. April 2007, 12:26

Bạn làm thế với web đơn giản thì được, nhưng với các site phức tạp sẽ gặp rất rất nhiều khó khăn. Tin mình đi, vì thêm nữa là vấn đề tính tương thích với các trình duyệt sẽ xảy đến nếu như khi preview bạn không thể nhìn thấy đủ các element trên site như nó phải có.
Đơn giản như bạn thử save nội dung của trang blog của mình. Kết quả sẽ khá tồi tệ vì trong CSS chỉ ra nhiều file ảnh mà trình duyệt ko sờ đến. Việc đi save từng bức trong CSS chỉ ra sẽ mất rất nhiều thời gian và sức lực.

Mình đã từng làm như bạn - đó đã là cách mình nghĩ đến đầu tiên ^^" (mình ko nghĩ đến việc làm online luôn) - nhưng thấy nó có quá nhiều bất cập nên thôi.
Cách của mình phải sử dụng đến internet 1 chút, nhưng sẽ rất nhanh vì bạn còn có cache của trình duyệt giúp sức chứ không phải cái gì cũng phải download.

danquynh 19. April 2007, 13:10

Hì hì... tớ chỉ là dân amateur, nên so far chỉ có mỗi Opera là không thể control được các trang HTML cho nên là site phức tạp nhất phải test. Nhưng tớ thấy làm cách đó rất ok, vì hình ảnh thật ra cũng không nhiều lắm. Hơn nữa, không tốn tiền là tớ thấy ok nhất :up: Dù tốn công chút (mặc dù công cũng là tiền p: ) nhưng cũng cảm thấy hả dạ lắm P:

Mà tớ đã save trang của sinfirex và test từ lâu rồi P: Hì hì... coi url của graphics và save từng hình đó P: Nói chung là thấy trang nào nhìn hay hay là view source và copy hết for later use P: Với lại hình của sinfirex rất đẹp nữa, save để mai mốt xài chuyện khác. Còn làm website dài dài mà P:

sinfirex 19. April 2007, 14:52

Hi, mình cũng có thói quen save trang đẹp. Giải pháp của mình là save ở dạng .HMT (dùng IE) nó sẽ chỉ ra 1 file duy nhất và khi xem rất tiện nữa (1 file mà).

chuotanhtuan 10. May 2007, 01:26

chi hien oi em moi lam blog nen doc em ko hieu gi ca mong chi hug dan that ky giup em

Anonymous 15. May 2007, 04:11

Anonymous writes:

"" Sau đó bạn dùng menu save as, hoặc save page as để lưu các trang HTML hiển thị blog của bạn vào folder vừa tạo""

SS HIền ơi !!! Chỗ này em ko hỉu cho lắm ??? em save folder vừa tạo vào ỗ C:\ nhưng em ko kím thấy chỗ menu như lời chị nói ở đâu cả ???

_ còn nữa ! cái phần "main" chị lấy ở đâu vậy ??? em chỉ có fần user thôi hả à :(
_ em mới tập tành viết blog nên ko hỉu đôi chỗ cho lắm !! chị hướng dẫn cụ thể giùm em nha...
thanks chị nhìu lém

danquynh 15. May 2007, 05:02

Chuotanhtuan, post này không hướng dẫn thay đổi giao diện, và chị cũng đã hướng dẫn chi tiết rồi đó :smile:

Em anon
1/ menu "save (page) as" là của trình duyệt chứ không phải của folder. Em nhìn lên thanh menu, chọn menu File rồi chọn tiếp save (page) as.

2/ Nếu em save trang của chị thì không có main.css, chị nói rõ ở phần lưu ý rồi mà :wink:

Trường hợp bạn không sử dụng theme mặc định của Opera (có nghĩa là bạn lưu với option "only use my custom style sheet") thì bạn sẽ không thấy đoạn mã có chứa main.css trong các file HTML.

ntcong 20. May 2007, 03:39

đúng cái em lăn tăn từ mấy hôm nay, tiền mạng lên quá trời :D , chị em mình giống nhau ghê ha. Thankyou very much, you're great :D
nếu em ko nhầm thì chị dạy TA phải ko chị?

danquynh 20. May 2007, 04:09

Chị dạy thêm tiếng Anh, kiếm tiền nuôi con P:

giadinhnho 18. June 2007, 16:34

Chào chị ạ. E là Hương e đọc bài viết của chị từ khi bắt dầu chập chững bước vào làng blog. e đọc gần như tất cả các hướng dẫn của chị và mò theo. Đến đây thì e không hiểu. vì e không tìm thấy phần head. mà các đuôi html của e, toàn hiển thị e (internet) e không vào chỉnh sửa được, e cũng k mở được html chắc do e làm sai. chị chỉ lại hộ e đc k?

giadinhnho 18. June 2007, 16:38

Đang viết bài thì bé nhà e khóc. Nên phải gửi vội chưa kịp cảm ơn chị. Cảm ơn chị nhìu he.

danquynh 18. June 2007, 17:48

Em click chuột phải trên các files html và chọn "open with notepad" nhé :smile:

1nguyenvanduc 9. July 2007, 15:06

chị ơi cho em hỏi..!!
mình mún thay cái hình banner kiểu khác thì làm sao hã chi.
em đã thử thay hình khác vào nhưng lại không biết dùng size bao nhiêu cho phù hợp:P
chị giúp em nha..!! cảm ơn chị
Àh !! xin lỗi chị , tại em mới vào làng blog nên mượn tạm css của chị để em làm nền tảng trang trí blog của em..:p
vài bữa nữa em kiếm được hình ảnh khác em sẽ trả bản quyền cho chị hen;) ..!!

danquynh 9. July 2007, 15:32

Em lấy được cái CSS của chị mà còn hỏi thay banner như thế nào sao? Chị có chục cái skin to share, sao không xài mấy cái đó mà phải lấy cái này? Hết nói!!

1nguyenvanduc 10. July 2007, 11:12

:frown: xin lỗi chị..!!
Nếu chị không muốn em sẽ xóa skin đó..!!
với lại em mún hỏi là cái size của banner cần bao nhiêu để phù hợp hả chị..!! em thử thay vào nhưng size không đủ rộng để vừa với nền blog..!!
Àh.! nếu chị có cái skin nào khác thì share cho em với..!!
:happy:
cảm ơn chi. nhiều..!!

danquynh 10. July 2007, 15:17

Em xem post "Thay đổi banner Blog Opera". Chị có khoảng 10 cái skins to share đấy, em xem ở sidebar, click vào từng link để xem demo.

1nguyenvanduc 16. July 2007, 09:03

zda...!!
cam on chi. nhiu hen..!!

minhvtv 28. July 2007, 07:02

không thể lưu lại được những gì đã thay đổi chị ạ.Cứu em với

dinhnguyen 7. August 2007, 05:28

Lâu quá hông dô lại trang của chị, khỏe không chị?

silv3r.blog 7. August 2007, 11:11

Em vẫn ko hiểu,mình tự tạo ra file main.ccs hay là khi save nó tự hiện ra hả chị,em save blog em nhưng ko có T_T

anhhai122 14. August 2007, 14:12

Chi oi! sao em em ko tim thay doan ma co chua user.css em chi tim thay co moi main.css. Em lam ca 2 cach save as va View source deu ko co. Hai neu co the chi cho em ban Test offline cua chi duoc ko P:

double808dethuong 19. August 2007, 11:19

Chị ơi, em đọc đi đọc lại và save hết tất cả lại mà em vẫn không biết đọan cần chỉnh ở đâu hết chị ơi:cry:

pham viet hung 10. September 2007, 02:28

CUU

24nh2 21. September 2007, 03:14

chi ơi! em ko hiểu vi sao blog của em ko save dc.Trong khi do em save dc blog của chị và tất cả các trang web khác.Chị có thể giúp em không? Em cảm ơn chị!

double808dethuong 22. September 2007, 08:37

Chị ơi...nhờ bài này của chị và bài viết HTML mà hôm bữa chị cho em link...em in về tối nằm đọc..rồi thực hành mà em đã tự làm nhà được rồi...Em cám ơn chị thật nhiều:love:

betrang 1. October 2007, 10:05

Chị Lu dễ thương ơi, chị vào xem giúp em cái layout với. Em làm thế nào mà banner thì đen xì, footer thì trắng xoá, background thì như bị lấm bùn, font chữ thì như tiếng arập. Chán quá. Mà em paste các đoạn code rất kỹ càng, đường link cẩn thận, nghiên cứu cả chị, cả Phamlam và cả kiwi nữa. Thế mà nó chẳng ra cái gì cả. Hu hu. Giúp em đi.

CombatantFlame 23. October 2007, 05:42

Hix....seo mấy cái theme tôi down về rồi up lên mà hok đổi theme dc dzị

danquynh 23. October 2007, 09:57

Minhvtv, sau khi save thì F5 :D

Dinhnguyen :love:

Silv3r.blog, em right click trên file.html, tìm đoạn mã có chứa main.css rồi truy cập để lấy về nhé :D

Anhhai122, nếu chưa customize thì sẽ không thấy main.css. Chị có vài themes to share, em down về mà xem nhá.

Double808dethuong :wink:

Pham viet hung, chuyện gì?

24nh2, em right click trên blog, chọn view source và tìm các file.css nhé.

Betrang, hình như câu này post 2 lần thì phải? :wink:

CombatantFlame, xin vui lòng đọc kỹ hướng dẫn trước khi sử dụng :wink:

betrang 24. October 2007, 02:38

Hehe, dung la chi Lu phai dong comment lai roi. Vi em post co 1 lan thoi, tu dau thang 10 co ma, chi doc roi, nay doc lai, thay quen nen tuong 2 lan day thoi. Hay la nhieu comment qua thanh ra tau hoa nhap ma chi oi. hic hic. thuong chi qua.

danquynh 28. October 2007, 17:07

Không, cái này trả lời rồi mà P: Chị copy and paste câu trả lời qua blog của em luôn mà, hic...

nhatcom.pro 16. January 2008, 17:34

Chị ơi giúp em với !!!
Blog của em từ khi opera nâng cấp thì em vào post ,viết bài xong nhưng lại ko có nút " Save " bây giờ em ko viết được blog nữa rồi , buồn wúa chị ạ ! Em làm để tặng bạn gái mà nhưng bi giờ thì bó tay ,chị giúp em với nha .Em cảm ơn chị nhiều lém !
Em _____________________ Dương Quang Nhật__________________

1 2 Next »

Showing comments 1 - 50 of 61.

Write a comment

You must be logged in to write a comment. If you're not a registered member, please sign up.

November 2009
S M T W T F S
October 2009December 2009
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
29 30

My Pages

Opera Guide

Opera Themes to share

Design Calendars

Highlighted Posts