Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.
Ask a Question

Anyway to attach icons to categories without core hack?

+6 votes
2.9k views
in Q2A Core by
edited by

Apparently working with categories need some inevitable core hacks, whethere you wanna display it in a diffrent form or move it elsewhere.

By attaching icons to categories I mean this:

 

by displaying category discription I mean this( remember at the time of creatioon of a category you can also enter description for that category, but we are not practically using (displaying) it anywhere!

 

also imagin that yo might wanna display the category list somewhere else not on the side bar. Remember how you can place a widget anywhere you want. I wanna be able to hide the category list from the front page, or place it at the top op page etc.

Also imagin there are 20 category to choose from, say for each city yo have assigned a category. Then you might be interested to list the category names on google map or an interactive map by clicking on which the user can selelct what category to go to.


I mean can we replace the existing category list wiht a widget for which we've developed the features above without core hack? just via a plugin+widget
 

Thank you

Also please visit this link: https://github.com/q2a/question2answer/issues/106

by
Hi Gabriel, I modified my question. Thank you

4 Answers

+4 votes
by

Actually there aren't so many core hacks needed. Let's tackle them one by one:

In order to add icons to the category widget you just need to apply some CSS to them. For example, if you're using SnowFlat you can do something like this:

.qa-nav-cat-item {
    font-family: "fontello";
    font-size: 16px;
}
.qa-nav-cat-food::before {
    content: '\e81e';
    color: green;
}
.qa-nav-cat-pasta::before {
    content: '\e81d';
    color: red;
}
.qa-nav-cat-cat1::before {
    content: '\e81f';
    color: purple;
}

And you'd get this output:

Rest of the answer goes in another answer because of character limit :/

by
Totally not maintainable. You'd have to change this every time you change something in the categories...
by
That is correct. The difference between a feature being hard or easy to maintain is still less than the difference between a feature being possible or impossible :) This approach turns it from impossible to possible.

Anyone who has a better idea to improve this approach is encouraged to add an answer :)
+4 votes
by

Then in order to add the style to the list it would be better if you have the categories ID in there (for some reason they're not included in the class). So use this CSS

.qa-nav-cat-item::before, .qa-category-link::before {
    font-family: "fontello";
}
.qa-nav-cat-item::before {
    font-size: 16px;
}
.qa-category-link::before {
    font-size: 12px;
}
.qa-nav-cat-food::before, .qa-category-link-3::before {
    content: '\e81e';
    color: green;
}
.qa-nav-cat-pasta::before, .qa-category-link-4::before {
    content: '\e81d';
    color: red;
}
.qa-nav-cat-cat1::before, .qa-category-link-1::before {
    content: '\e81f';
    color: purple;
}
 
Note X stands for the category ID in .qa-category-link-X. Now you need to force that category ID to come from the core. Add this to your qa-theme.php file:
 
public function post_meta_where($post, $class) {
    if (isset($post['raw']['categoryid'], $post['where']['data'])) {
        $categoryId = $post['raw']['categoryid'];
        $post['where']['data'] = str_replace('class="qa-category-link', 'class="qa-category-link qa-category-link-' . $categoryId,     $post['where']['data']);
    }
    qa_html_theme_base::post_meta_where($post, $class);
}

This is the output:

This should also update the category in the questions.

Rest of the answers after dinner :)

by
Thank you for your time, very helpful tips. I can see we haven't yet touched the core. very promising so far
+4 votes
by

In order to add the icon of the category to the H1 section title (which I totally missed the first time I look at the screenshot) you'll have to override the title() function in your theme. Most themes will have already override that function. SnowFlat is no exception to this rule so I'll show what to do when the function already exists.

Go to your qa-theme.php file and add this code to the beginning of your title() function so that it looks like this:

public function title() {
    if (isset($this->content['categoryids'])) {
        $categories = $this->content['categoryids'];
        $categoryId = end($categories);
        if ($categoryId !== false) {
            $this->content['title'] = sprintf('%s<span class="category-title category-title-%d"></span>', $this->content['title'], $categoryId);
        }
    }
    ... rest of the function ...
 
Then add the necessary CSS. Updating the previous one, it would look like this:
 
.qa-nav-cat-item::before, .qa-category-link::before, .category-title {
    font-family: "fontello";
}
.qa-nav-cat-item::before, .category-title::after {
    font-size: 16px;
}
 
.qa-nav-cat-food::before, .qa-category-link-3::before, .category-title-3::after {
    content: '\e81e';
    color: green;
}
 
... rest of the categories ...
 
The output should look like this:
 

 

+4 votes
by

Regarding adding the category description after the category title is simpler, as you just need to override the page_title_error() in your qa-theme.php file:

function page_title_error() {
    qa_html_theme_base::page_title_error();
    if (isset($this->content['categoryids'])) {
        $categories = $this->content['categoryids'];
        $categoryId = end($categories);
        if ($categoryId !== false) {
            $result = qa_db_single_select(qa_db_full_category_selectspec($categoryId, true));
            $this->output('<div>' . $result['content'] . '</div>');
        }
    }
}
 
Of course, style the divs according to your needs.
 
also imagin that yo might wanna display the category list somewhere else not on the side bar. Remember how you can place a widget anywhere you want. I wanna be able to hide the category list from the front page, or place it at the top op page etc.
Well, that is very custom stuff. You're basically designing your own theme in there. As you know, it is not possible to currently configure the position of that pseudo widget. Anyway, I can show you how to hide it from the front (home?) page.
 
Just override the doctype() and make it look like this:
 
function doctype() {
    if (qa_request() === '') {
        unset($this->content['navigation']['cat']);
    }
    qa_html_theme_base::doctype();
}
 
Also imagin there are 20 category to choose from, say for each city yo have assigned a category. Then you might be interested to list the category names on google map or an interactive map by clicking on which the user can selelct what category to go to.
Well, by following the steps above you an figure out how to get the category id from the core. Then you can add custom HTML or JS to your page and dinamically attach whatever event you want for each category, such as opening google maps or whatever you're looking for.
 
Short answer: Yes, you can do that without a core hack :P
by
Very impressive! Thank you for the details and tips very helpful
by
@Waterfr Villa... I'm so glad you asked this question! Given pupi's replies. Are you thinking of doing a plugin along these lines? I'd be interested to know of any progress, if you are thinking of it.

@pupi1985... Congratulations on a wonderfully comprehensive answer! I am not a code developer, but this has given a wonderful insight into how things work in a practical sense and even I have learnt something valuable from your answers here. Well done that man!!!
by
@Funruna
I am mostly a java developer not much of experience in PHP development from scratch I am learning by modifying other people's code and not ready to write a plugin. Also the plugin that I have in mid has other requirements too, e.g. users to be able to create categories(to be approved by admin), users to be able to set their own default category so that they dont have to every time select the category from a log list. Example: you have create q2a for a country and for each town there is a category. you live in London and 95% of the times the category of your question is london. SO london to be  selected by default for your questions (and you can change it of course) . So  first wanted to see if it at all is possible without core hack. Pupi's answer was helpful indeed.
by
I see the logic as you've expanded the idea/concept and I do like the thinking.
Snow Theme by Q2A Market
Powered by Question2Answer
...