3x logo retina , subcategory button directly article,total views counter

Posted in: Newspaper
Post count: 10

1) Hi, i asked help in this topic for logo.
https://forum.tagdiv.com/topic/change-logo-section-to-put-3-different-logos-side-by-side/
I did this modification for desktop: https://www.screencast.com/users/fabiotanas/folders/Default/media/4700775c-b380-4a81-baba-cca3c60c797d
result: https://www.screencast.com/users/fabiotanas/folders/Default/media/f39a650e-45dc-42e3-ab39-6158a90d0d78
this for mobile: https://www.screencast.com/users/fabiotanas/folders/Default/media/3f97f9f1-b39c-4443-9814-961f0745a7ee
result: https://www.screencast.com/users/fabiotanas/folders/Default/media/e8ee4f00-af4c-47bd-bd9f-5966d8955ab9

custom code: https://www.screencast.com/users/fabiotanas/folders/Default/media/eaae21b8-08a6-49d8-b3a3-da447ca03d9a

The layout its perfect but logos for mobile and ipads are blurry. How to do same thing with retina logos? where i have to put codes like i did for non retina logos? thx

2) when i press here (subcategory) button it goes in the subcategory page, i want that goes directly inside one article. is it possible?
https://www.screencast.com/users/fabiotanas/folders/Default/media/9491ca84-b40f-42fa-a9e7-cda09fad038d

3) when i choose theme colors in main menu id like to set the active color only, so i have to disable the hover color for normal menu and sticky too.how to?

4) id like to show a TOTAL views counter in the home page on the sidebar (under advertising) is it possible? thanks for all

  • This topic was modified 7 years by mayer62.
Post count: 20688

Hi,

1. By default a logo and retina logo can be uploaded in the theme panel, the retina logo will be displayed when needed automatically. If you entered the images directly in the theme header template, those will be displayed at all times.

Maybe create bigger images with a higher resolution (and reduce them with CSS), that may provide a better quality result.

It would be more difficult to switch the images when retina is detected or by screen width, maybe it could be done
https://stackoverflow.com/questions/15142902/php-echo-statement-if-screen-is-a-certain-size
https://developer.mozilla.org/en-US/docs/Web/API/Screen/width
https://wordpress.stackexchange.com/questions/269133/detect-screen-width-in-functions

2. Since that is a category, clicking it will direct to the category page. The mega-menu will display only categories. You could use a redirection plugin and redirect the category you want to a different page
https://www.wpbeginner.com/beginners-guide/beginners-guide-to-creating-redirects-in-wordpress/

3. The active and hover color are tied together. I could give you a code that will change only the active state and not the hover
https://www.screencast.com/t/RCpgk6v1

.sf-menu > .current-menu-item > a:after {
background-color: yellow;
}

4. Maybe with a view counter plugin, or statistics plugin. Check some of these for example
http://learningcms.com/wordpress-post-views-counter-plugins/
https://wpmissing.com/plugins/elegant-vistor-counter-wordpress/

Thanks

Post count: 10

Hi thanks for support! All done except for point 1. I can’t use the theme panel option for logo because I have to put 3 different logos and links! So I used code like screenshots but:
1) why when I refresh pages all 3 logos appear for 1 sec in wrong position?
2) the layout it’s perfect but for smartphone and iPad the quality of logos is low. It’s why I though about retina logos. But in your opinion it’s better put logos bigger and reduce them with css but how? Can u look my code and tell me mistakes or tricks to fix these 2 probs in better way? Thanks a lot guys, hope you ll help me because it’s last detail to change and it’s perfect!

Post count: 20688

Hi,

The code in the custom CSS is loaded at a later time, so the images may appear in their initial position, and then the custom CSS will be loaded.

A solution would be to load the custom code with the theme stylesheet, try to enter it there at the end (there you have to wrap the code for each device in media queries)
https://www.screencast.com/t/wRx3yytYXUvm
https://www.screencast.com/t/khP8q3CV
https://www.screencast.com/t/HdcoMy3o

This effect should be reduced or removed if you will use a caching plugin to serve cached content to website visitors (non-logged in).

You could reduce the images with CSS by setting a max-width to them (height should be auto). Maybe that will work, you could try it. Further positioning or CSS code you use should not affect the image quality. Basically this is what retina does, displays double the image size.

Post count: 27

Hi.
I tried to put my custom css code into the file style.css in my child theme, but Newspaper do not like this move.
Do I have to insert custom css code in style.css of parent theme? But what about upgrade?

Post count: 10

Go here wp-content\themes\Newspaper and modify style.css file. You have to add your custom code at THE END of file, for every screen type for example:

@media
(min-width: 1141px) {desktop}
custom code

@media
(max-width: 1018px) and (min-width: 768px) {iPad portrait}
custom code

@media
(max-width: 1140px) and (min-width: 1019px) {iPad landscape}
custom code

@media
(max-width: 767px) {phones}
custom code

then install a cached plugin like W3 Total Cache

Post count: 27

Thank you for your hint!

Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘Newspaper’ is closed to new topics and replies.