Fix category description or static block pos.

In working through settings of our categories, many have a description or static block the provides additional direction to the user.  It appears that formatting for these is not properly handled in UB Trex Pro as the text appears flush to the left edge of the browser and directly adjacent to the menu bar above.  In reviewing the CSS, category-description and category-cms do not have any additional elements added to them to position them and format to match the rest of the page.  Is this possible to fix in the template rather than having to override the CSS everywhere?

12 answers

Profile photo of Ziven Staff 100280.00 $tone January 20, 2020
Public

Hi Mark,
 
I am sorry for replying to you this late as we’ve just been back from our weekend. 
 
Could you please follow one of the following options to define the style your way? 

UB Trex Pro theme supports 2 options to overwrite CSS: 

  1. Option 1: Go to Admin -> Ubetheme -- > Theme Helper -> Trex Pro -- > Setting -> More -> CSS Module > from here, you add your custom CSS 
  2. Option 2: Define your own LESS via this file: app\design\frontend\Ubertheme\trex_pro\web\css\_custom_styles.less

Once you add your own custom style (for both options above), you need to compile LESS -> CSS following these steps to apply your changes: 

You should back up your site first. Once done, you access your server via SSH and navigate to your Magento 2 folder, then run the following commands one by one:
Step 1: php bin/magento maintenance:enable
Step 2: rm -rf var/di/* var/generation/* var/cache/* var/log/* var/page_cache/* var/session/* var/view_preprocessed/* pub/static/frontend/Ubertheme/trex_pro/*
Step 3: php bin/magento setup:static-content:deploy -t Ubertheme/trex_pro -language en_US -f (Make sure you are using developer (or default) mode)
Step 4: php bin/magento cache:flush
step 5: php bin/magento maintenance:disable
Step 6: clear your browser cache

If you still need our help when adding the custom style, please provide us your site instance (URL and admin credentials) and let us know the expected style you need, we will follow up further with you then. 
Best Regards,
Ziven.

#1
Profile photo of Mark Schuster 70.00 $tone January 20, 2020
Public

I can certainly handle overriding CSS, but this seems to be an error in your theme as a standard feature of Magento (category description) is not displaying properly.  Just want to give you all an opportunity to fix this.

#2
Profile photo of ubdev Staff 98150.00 $tone January 21, 2020
Public

Hi Mark,
Could you please share with us how the category page design you need (Any sample design will be helpful)? We will suggest the style accordingly then. 
We will improve the theme when our team is back to work after our 7-Days Festival, as shared with you via our first conversion via email (our event will start from Jan 23). 
Thanks for your understanding.
Regards,
Ubertheme team
 

#3
Profile photo of Ziven Staff 100280.00 $tone February 11, 2020
Public

Hi Mark,
We’d like to follow up further with you regarding the new questions you mentioned in the email: 

1) (Posted to the forums, I owed the screen capture attached) Fixing the display of category description so it matches the rest of the theme. On the attached, the black text is how a category description displays in the UB Trex Pro theme. I’ve added a second line of text in blue via PhotoShop which is what I would expect as behavior so the text layout matches the spacing of the rest of the theme. Just need to figure out how to override the display to do that.

It would be best if you can provide us SSH credentials of your staging instance, we will add a sample style for the default category. You can mark your reply ‘private’, then it’s safe to share your site info here. Only you and our technical team can access. 

2) The slider does not appear to be generating the appropriate CSS code for our home page. Screen grab attached -- the fonts are the wrong size and the title of the slider is displaying in dark text in the upper left hand corner. I’ve compared all my settings against the demo and everything appears correct. Happy to provide SSH & admin access if you want to take a look.

In order to change the font-size of the Title and Desc, you can open the file: app\design\frontend\Ubertheme\trex_pro\web\css\source\home\_home_fashion_version1.less, then change the following declarations: 

  • The title font at line: 113 (desktop), 103 (mobile), 107 (tablet), 110 (small desktop: min-with: 1360px);
  • The desc font at line: 118 (desktop), 121 (mobile), 125 (small desktop: min-with: 1360px);

(Please note the lines of code mentioned above are based on default file of our theme). 
Then you compile LESS to CSS as noted in my reply #1 above. 

3) I need to uninstall the enhanced layered navigation extension from you as it does not meet our needs -- we will be using the Amasty extension as it supports the multiple select with an “and” logic that we need. I can certainly delete the files, but are there any specific uninstall instructions?

It’s pity that our Layered Navigation has not come up with your expectation. You can uninstall the module following this guide
 
For any new questions, please submit a ticket here, we will follow up with you. 
 
Best Regards,
Ziven.

#4
Profile photo of ubdev Staff 98150.00 $tone February 12, 2020
Public

Hi Mark, 
We could not access with the SSH credentials you provided, please check again.
Also kindly help to whitelist all our IPs below: 
113.190.252.133
118.70.176.221
113.190.254.239
Once we can access your M2 instance, we will take a closer look at the slider issue. 
Regards,
Ubertheme team
 

#6
Profile photo of Mark Schuster 70.00 $tone February 13, 2020
Public

For the slider, the issue here is that your extension is not working properly, not that I’m trying to customize the look of it via CSS.  Your tweaks to the CSS made the text look better, but the extension is still not working properly -- in the upper left hand corner, you can see that the title of the slider is displaying (this is not the case in your demo -- http://bit.ly/ub-trex-pro-demo).  I can provide a screen capture by e-mail if needed.  Title is a required field in your manage slides interface, so I can’t just not fill it in and it looks bad to have it displaying.  All I’m looking for here, is for the extension to operate and display as the demo does.
For the category description issue, I’m just going to fix it myself -- as I said, we can do that, but it appears to be a bug in your theme that a standard Magento functionality used by many for SEO optimization does not display professionally in the template.  Just giving you the opportunity to fix it for everyone.

#11
Profile photo of Ziven Staff 100280.00 $tone February 14, 2020
Public

Hi Mark,

I’d like to update further below: 

For the slider, the issue here is that your extension is not working properly, not that I’m trying to customize the look of it via CSS.  Your tweaks to the CSS made the text look better, but the extension is still not working properly — in the upper left hand corner, you can see that the title of the slider is displaying (this is not the case in your demo — http://bit.ly/ub-trex-pro-demo).  I can provide a screen capture by e-mail if needed.  Title is a required field in your manage slides interface, so I can’t just not fill it in and it looks bad to have it displaying.  All I’m looking for here, is for the extension to operate and display as the demo does.

I see the slider title you mentioned (it refers to the title like this screenshot: https://www.dropbox.com/s/w4ny4sdmzezq643/2020-02-14_10-14-01.png?dl=0). Our team will check further into this this. 

Meanwhile, when checking the configuration of font-size of your Slider, I noticed that you missed the class <div class=”slideshow-section”>. So you can try to update your Slider configuration as follows: 
Step 1: Go to Admin -> Ubertheme’s Extensions -> Theme Helper -> Configuration -> Ub Trex Pro -> Theme -> Typography -> Heading -> H2 -> Font Size, then specify the value you want.
 
Step 2: Go to Admin -> Content -> Elements -> Block -> PE Home Slideshow(pe_slideshow) 
and replace the code: 

<p>{{block class=”Ubertheme\UbContentSlider\Block\Slider” show_title=”0″ name=”pe_slideshow” content_type=”slider” single_item=”1″ slider_key=”pe_slideshow”}}</p>

with: 

<div class=”slideshow-section”>{{block class=”Ubertheme\UbContentSlider\Block\Slider” show_title=”0″ name=”pe_slideshow” content_type=”slider” single_item=”1″ slider_key=”pe_slideshow”}}</div>

Once done, you should have the slider like this: https://www.dropbox.com/s/vvvvgdze1nebnm2/2020-02-14_09-58-43.png?dl=0 

For the category description issue, I’m just going to fix it myself — as I said, we can do that, but it appears to be a bug in your theme that a standard Magento functionality used by many for SEO optimization does not display professionally in the template.  Just giving you the opportunity to fix it for everyone.

Thanks for sharing with us this info. 

Our team will check further and improve our theme in the next version. 
Best Regards,
Ziven.

#12

Please login or Register to Submit Answer

Written By

Comments