{Giúp với} Thêm Icon Nháy Trên Thanh Menu

Mình chèn trong trang quản trị nó cứ bị như vậy !!


mình muốn chữ hot trên chữ khuyến mãi thì làm như thế nào mọi người
ai biết chỉ mình với

 

Ai giúp mình với !!

 

Chuyện nhỏ thế mà kg có ai giúp em nó à.
Cái nầy phải sửa css. Cho đường dẫn trang web đi mình tìm cách thử.

 

<a href="link trang web of minh" target="_blank"><img src="images/hot-icon.gif"> KHUYỄN MÃI</a> css menu đó mà k được bạn ơi

 

Ối giời ơi! link gì mà kì cục vậy...!!!??? link nầy có liên kết tới đâu đâu!...bộ trang web của bạn còn nằm trên localhost hả.!?.Vậy kg tiếp cận được css sao mình sửa được. Web của bạn phải nằm trên mạng thì mình mới hướng dẫn cho bạn sửa được, còn nếu chưa up lên mạng thì bạn phải gửi nguyên bộ cài đặt hoặc folder template ( kèm thông tin joomla version mấy) thì mình mới sửa được.
Còn cái mà bạn post lên chỉ là code html , nếu code nầy muốn cái hình gif nó nằm ở trên thì cú pháp như vầy <a href="link trang web of minh" target="_blank"><img src="images/hot-icon.gif"></br> KHUYỄN MÃI</a>

 

Menu bạn code tay hay dùng mod menu có sẵn trong joomla.

 

mình ms làm joomla bạn thông cảm ..giúp mình vs
"mediafire.com/?yvljgho0da54l2b" (tại mình chưa post đc link ) đây là foder template của mình (joomla 2.5.x)

 

Mình tạo menu có sẵn của 1 template bạn à

 

Template nầy có bản quyền nên không cài được bạn ơi! ( cài thì được nhưng Front-end bị lổi Helix framework not found.).Nếu có thể thì bạn gửi nguyên bộ quickstart mình cài trên localhost rồi mới sửa được, và bạn phải cho mình biết bạn xử dụng style số mấy, icon nháy nằm trên trái hay trên phải hay trên giửa hay nằm cùng hàng nhưng cách ra.Nếu nằm trên thì height menu phải cao hơn thì xấu nha.

 

Đây là bản Quickstart "mediafire.com/?trhn69phw8z9zt4"..mình dùng style 1..mình mún icon nằm trên phải của chữ Khuyến mãi..bạn à ..có gắng giúp mình với nhé cảm ơn bạn nhiều !

 

Bạn tải cái nầy về giải nén.
http://www.mediafire.com/download/g58n167pqp56ywg/menu.css_hot_gif.zip

file menu css thì bỏ vào folder css theo đường dẫn
joomla của bạn/templates/shaper_financial_news/css/menu.css

file hot.gif thì bỏ vào folder images.Bạn thử add hình gif mình gửi xem sao đừng lấy hình khác có kích thước khác có thể không đẹp như ý.

Kết quả:

Chú ý: menu nào có hàng chữ dài thì vị trí icon có thể nằm trên giữa nha!

 

Mình làm theo kết quả nó lại nằm lên trên bạn à
Chắc do mình thay đổi kích cỡ có sẵn của menu template
Dù sao cũng cảm ơn bạn nhiều nhé.Bạn rất nhiệt tình


Nếu được bạn có thể teamview sửa hộ mình đc không bạn

 

Bây giờ bạn mở file menu.css đó bằng notepad++ rồi kéo xuống hàng số 44 bạn sẽ thấy đoạn code sau:
#sublevel ul.level-1 > li.menu-item span.has-image{padding-left:18px;padding-top:10px; display:block;background-repeat:no-repeat;background-position: 22px 0px;}

Bạn muốn dịch chuyển hình gif sang phải thì tăng chỉ số của thông số màu đỏ ( theo cái menu của bạn thì mình nhắm chừng phải tăng thêm cở 30px .Bạn cứ chỉnh từ từ khi nào thấy ưng ý là được ).Thông số màu xanh là vị trí hình gif tính từ trên xuống, thông số nầy để 0px là tối ưu nhất.

Bạn muốn dịch chuyển hình gif lên cao cách hàng chữ tiêu đề menu thì tăng chỉ số màu tím.

Còn một cách nữa là bạn sửa background-position: 22px 0px; thành background-position: top right; ( Cái nầy là tối ưu nhất, chỉ cần điều chỉnh vị trí icon lên cao hoặc xuống thấp thôi. [ padding-top:10px;] )

Bạn chú ý khi sửa css không được sai cú pháp, chỉ cần một lổi nhỏ như thiếu dấu ; hoặt viết sai từ top right thì chẵn những đoạn code vô giá trị mà còn làm web của bạn bị chậm lại do trình duyệt xử lý đoạn code sai rất lâu.

Cái nầy chỉ thêm: Nếu bạn chọn được hình gif ưng ý nhưng kích thước hình bạn không vừa ý thì bạn vào trang http://www.online-image-editor.com/ up hình lên trang nầy resize kích thước hình lại rồi save về my compurter.

Bạn có gì trở ngại bạn cho mình biết, cái nào mình làm được mình giúp cho, đừng ngại.

 

Hi cảm ơn bạn rất nhiều mình đã làm được nhưng có điều mình rất gà css và khi làm theo bạn mình đã chỉnh dòng 29 pading :3px 10px để được như vậy :

Nhưng cái cái hình gif lại làm tăng kích thước của Khuyến Mãi bạn à mình tìm mãi để chỉnh cái kích thước mà khôn được :

Đây là toàn bộ file css của mình khi mình vọc chỉnh sửa !!Bạn xem và sửa giùm mình với !

mediafire.com/?d8e76ilrgch3yih

 

Vấn đề nầy khá rắc rối,sửa thì được rồi nhưng nó làm ảnh hưởng đến các mục menu khác khg có icon khi mình active hoặc hover đến mục menu khác không có icon nháy , để giải quyết vấn đề đau đầu nầy chỉ còn cách chèn đồng loạt cho các mục menu khác icon có dạng image transparent (ảnh vô hình) để nó đồng bộ được với mục menu có icon. Image transparent phải có cùng kích thước với icon nháy.Nếu bạn khg biết cách tạo Image transparent thì bạn gửi hoặc cho biết kích thước icon nháy của bạn mình làm cho.

Bây giờ bạn mở file menu.css dòng 35 có đoạn code sau:

#sublevel ul.level-1 > li.menu-item.active> a.menu-item{background:#660066;border-top:1px solid #d8d8d8;margin:-10px 0 0;padding-top:13px;padding-bottom:15px}

thế vào bằng đoạn code nầy:

#sublevel ul.level-1 > li.menu-item.active> a.menu-item{background:#660066;border-top:1px solid #d8d8d8;margin:-1px 0 0;padding-top:3px;padding-bottom:15px}

( Chú ý: code nầy sửa theo icon của mình nên kết quả có thể khg như ý bạn)

Kết quả:

 

Icon này ở trên bạn có gửi cho mình rồi đúng không !
Mình đã thay dòng css 35 thì cái menu có icon đó đã ổn nhưng các menu khác lại bị vỡ bạn à !!

Cái này rắc rối bạn nhỉ !! có hướng nào giải quyết giùm mình với

 

Minh ban lam ca dem. Mai minh giai quyet cho.de thoi ma.Cach giai quyet minh noi o tren roi do.Minh online bang dien thoai kho dang bai qua.

 

Bạn tải file nầy về giải nén....

https://www.mediafire.com/?zxmx2u3do7adick

.....và làm theo các bước sau:

- Bỏ 2 file image hot.gif và transparent.png vào folder images của joomla.
- Tiến hành add image hot.gif vào menu KHUYẾN MÃI.
- Add images transparent.png vào các menu còn lại ( transparent.png là image trong suốt không có hình khi add vào menu sẽ không hiển thị image nên bạn không thấy được. )

Kết quả: tất cả menu sẽ có cùng thuộc tính.

Sau khi làm xong bạn cho mình biết kết quả, cần sửa thêm chổ nào bạn cứ cho mình biết.

 

rebel123 xứng đáng 1 like
* nếu toại nguyện và câu trả lời, thảo luận tích cực, hợp lý Người đọc đừng quên CẢM ƠN

 

Rất rất cảm ơn bạn !! kết quả thành công hoàn toàn bạn à !!
Cảm ơn bạn rất nhiều !
Chúc bạn sức khỏe và thành công
Bạn rất nhiệt tình !
Hi vọng sẽ có dịp giúp đỡ bạn 1 việc gì đó
Và mong bạn sẽ luôn hỗ trợ mọi người và mình trên con đường joomlla này !!(mình sẽ còn nhờ bạn nhiều đấy !! )
Thân ái