Support Forum
Support Forum
Offline
Hi SP-team,
this is my first attempt of using WP shortcodes within my forum. I disabled filtering in the options settings and posted a shortcode in a post. The shortcode is part of The Dropbox Plugin.
When using it in the forum, I see a very different picture of the output than in a normal WP page. Please see attached images :
the original WP page
and how it displays in the SP post:
Comparison shows that the checkboxes are completely overwritten - in fact, when loading they show up first but are then overwritten by the following content. If I put them in a single line, they do show up first and vanish as the post completes loading.
Also, the frames of the html forms (buttons nad input boxes) disappear except the file form. The styling of the forms is absolutely identical.
And it is specific to SP! If I use the unchanged shortcode in my blog, the display is as it should be. I also tried different SP themes and it turned out, that it is the same picture in all themes.
It looks exactly like the style is correctly displayed but, in the progress of loading the SP theme style, it is overwritten.
"Computers in the future may weigh no more than 1.5 tons."
(Popular Mechanics, US-Technik-Magazin, 1949)
Offline
It looks like most of the issues are going to boil down to CSS settings in SP conflicting or overwriting the CSS for the drop box plugin.
It will probably require some special CSS changes either in the Drop Box plugin's CSS file or Simple:Press's. The only way to determine what would be needed is by inspecting the CSS live on the site using FireFox's Firebug or Chrome's CSS inspector.
Custom Simple Press Themes
Offline
Regarding the checkbox I found out, using Firebug, that there is a class named 'hiddenCheckbox' added to the plugin's html code. It does not have a css , I'm afraid. It does not matter wether I add my own class to the form or none, it is just converted to or replaced with 'hiddenCheckbox'. Obviously, it has an '!important' tag in the SP theme's CSS.
How can I change that without hurting the forum functionality?
"Computers in the future may weigh no more than 1.5 tons."
(Popular Mechanics, US-Technik-Magazin, 1949)
Offline
In the root folder of the SP piugin (i.e., 'simple-press') is a file named sp-config.php.
Open that file ina plain text editor and find the line:
define('SF_USE_PRETTY_CBOX', true);
Try changing that from true to false...
 |
YELLOW
SWORDFISH
|
Offline
Thanks, Andy!
that did the job for the checkboxes! Now I am getting nice ones!
Regarding the frames for buttons and inputs, my Firebug says the following:
My theme is 'default' and my overlay 'brown-cream'. The 'border: 0 none' is the cause for not showing the frames. If I change it online in Firebug, I am getting nice frames around the elements!
Thinking to have understood themes and overlays, I went to the default.php and found a parameter called $controlborder at the form controls section. Reading the 'brown-cream' overlay, I found the same parameter in there and set with a nice value!
Why doesn't it take that value? Instead, it is coming up with '0 none' and I could not find out why. This value is not even in the reset.css.
How can I change my form frames without destroying the whole bunch of tags above?
I've tried to put a style statement like that
?> <style type="text/css">
form {border:6px solid #111; }
.Button {color:#000; border:3px solid #000; }
</style><?phpinto my code, but to no avail. The border statement is neglected or overwritten. Other elements like i.e. 'color' are getting through and show up correctly.
Could you kindly help again, please?
"Computers in the future may weigh no more than 1.5 tons."
(Popular Mechanics, US-Technik-Magazin, 1949)
Offline
We try and target Simple:Press CSS to be very specific so as not to effect other items that will be displayed on your page - such as sidebar, footer etc.
Our control stylings will be looking for very specific classes such as 'spButton'. What you have attached in the image is the reset.css. Then if this were a button with one of the sp class names it would have it's own css appearing. But it isn't so there are no stylings defined.
What you need to do is find the class name of the button that your shortcode plugin is creating and then create a style for that. So if you use Firebug to look at the html output of the shortcode button you should, I would hope, find a class name then all you need to do is define a rule for that class name to have a border.
|
YELLOW
SWORDFISH
|
Offline
This is a thing I do not really understand!
As there was no class initially defined with the buttons, I have issued the above css style definition directly in the plugin's code. According to Firebug's CSS tab, it is valid and present. When I apply the class to the html code, the color is taken over, the border is still falling back to '0 none' - although it is part of the same class definition as the color.
I also tried a button class defined for this purpose in my WP theme's style.css and it is the same again. Those classes are valid and present but when applied within the spMaincontainer domain, somehow the border attribute is replaced/overwritten.
Finally, I have just put an '!important' into the border attribute - and this worked!
As it looks now for me, the reset.css is set as a default - not as a fall back strategy if nothing is defined! Some of the tags have to be overwritten with '!important' to get through.
This is how it works now for me :
?> <style type="text/css">
/*form {border:6px solid #111; }*/
.Button {color:#000; border:1px solid #111 !important;}
.Bereich, .Feld {border:1px solid #111 !important; }
</style><?phpDid not dig in further on this - my shortcode is working now!
Thanks for your help!
"Computers in the future may weigh no more than 1.5 tons."
(Popular Mechanics, US-Technik-Magazin, 1949)
Offline
No - you are just mis-understanding how CSS works and what takes priority.
Look at the SP rules again. each one starts with #spMainContainer. This is an ID (#) not a class. An #ID outranks a .Class every time. So any rules contained within this ID is going to have precedence over a simple class ,like .Button
The use of !important will cap it but it is not a good thing to use. I was rather hoping your other plugin wojuld have specific class names or even an ID as then you could have put it inside the #spMainContainer ID
|
YELLOW
SWORDFISH
|
All RSS1 Guest(s)