Im making a website using Drupal 7.
I just installed the 'Social Media' and 'Widgets' Modules.
Then I added the fb like box to the left sidebar region of my danblog theme.
As you can see the box overflows the block.
Can I solve it by some configuration or do I need to change the css manually?
I wanted to know where exactly can I find the CSS of these blocks so that I could try to change it?
There are so many .php files and some .css files in drupal.
If someone could please elaborate on some technique or some basic understanding by which I can find the styling of blocks in those php files as I assume they may not be in seperate .css files
Thanks
Quick fix not recommended:
#f3c805688 { width: 220px!important; }
You really don't want to use !important it works as a quick fix in this case, but the ideal fix would be to change the height of the iFrame before inserting it into the page via some backend interface. Does the social media module have an option to change the width?
Related
I'm creating a gallery of images in ReactJs. There are a lot of examples online, but i didn't find anything that is perfectly responsive on desktop browsers and also completely mobile friendly.
In particular, when an image is opened on the mobile browser, i need to be able to zoom the photo with a double tap, and close the photo when i drag it to the bottom
I already tried all the principal solution that i found online.
For example, i tried all of these https://reactjsexample.com/tag/lightbox/
and much much more.
I also tried different approaches like CSS rules, Viewport rules, create a simple zoomable html div, etc... But nothing worked.
Basically, what i what to achieve is exactly something like this: https://www.lucapetruzzi.com/gallery/1
Created thanks to this library: https://photoswipe.com/ that unfortunately i can't use in React.
(I also tried the react-photoswipe and react-photoswipe-2 libraries but it seems not maintained and not working with new versions of React)
Thank you for any help
So for previous comments, I wrote a snippet for you, check here
Here are the mainly steps:
use npm install photoswipe so DON'T need to include builded js but NEED to include css in index.html (or you can import in App.css)
write the markup in js component
init it by click button or in useEffect
I am using PaxWeb Http Whiteboard service in Apache Karaf; while everything works, I am unable to get certain CSS styles rendered properly -
for example,
arrow-dropup-circle {
content: "\f364";
}
This is supposed to display a drop up circle but when hosted in PaxWeb, though the css is loaded; it does not render the content. While it displays square boxes in chrome, in firefox; it just shows the number f364 in a square box.
Please note that this works when I host my website in NodeJS.
My blueprint is same as the one given here.
Can someone shed some light into why am not getting css rendered properly?
Thanks
Venkatesh Laguduva
I had a same issue. In my case, font files (like .ttf, .woff) were failed to decode while loading the page. Maven was corrupting that. It is filtering files with those extensions. To exclude files from filtering based on the extension, we can use "nonFilteredFileExtensions" tag in pom. This solved my decoding issue.
For the 2sxc DNN module: Is it possible to disable the "quick insert" menu (with "add content module" and "add app module") that appears when I hover over ANY module or pane on the page...whether in Edit mode or not? See screenshot:
Screenshot
I only use the Content module in a few areas and DNN's core HTML module for the rest of the content. It's very confusing to my editors. They keep accidentally adding more Content modules to the page and it's just visually distracting if not needed/wanted. It would be nice to have a choice in whether this feature is enabled. Thanks!
For now there is no real switch to do this, but you can easily do it yourself.
There are some unique css classes. If you target them in your CSS, you can make it go away. I would need more time to figure out exactly which ones they are, but I'm sure you'll figure it out.
As #iJungleBoy recommended I did it with CSS using the Snipped Inject App. Unfortunately this App also adds some menus i don't want. This is my CSS rule:
.sc-content-block-menu, .DnnModule-7777 .sc-menu { display: none !important; }
These answers are old - you can now do it by adding an attribute to any dom-element as described here: https://github.com/2sic/2sxc/wiki/Html-Js-%24quickE
I have installed a theme like this:
wp-content/themes/themename-main/themename-theme
Installation worked fine, I began editing my site, that was good. But, I faced a problem with navbar menu that didn't display my menus, so I went to the theme provider site, and they said that theme must be installed as follow:
wp-content/themes/themename-theme and not wp-content/themes/themename-main/themename-theme
So I decided to move wp-content/themes/themename-main/themename-theme
to themes folder and reinstall my theme. Since I've done this, it has messed up with images and content, that disappeared.
How can I solved that ? I just changed the folder level of themename-theme in wp-content/themes
Big thanks in advance
If you revert back to another theme, does the issue still persist?
If the images and content are back in place and are showing then it is most likely a theme issue.
if you have any knowledge of CSS then I would suggest that you go to the stylesheet and look for the .navbar or .navigation depending on what they are using.
(Could also be #navbar or #navigation)
if you menu's aren't showing then it will be in the Stylesheet where it hides the lower level tears. Check for code set to display:none or visibility:hidden and change those attributes and see if the menu shows.
Removing sections of css code and then re-adding them will not mess your site out as long as you place it back correctly.
This sounds like a Stylesheet error to me and if so then the only one that can help you are the Devs.
Also if you have another site then you can try and test it there and see if it has the same problem which will determine a fault with the theme.
Hi I am logging as admin but block config option icon is not showing on top right corner of every block. I have to opt a long route to configure the blocks. plz help.
check your style file you may add display:none to it or any style conflict with it
most likely it's a theme issue, try to switch to one of the themes that shipped with Drupal, and check if they show up.. if not please post a link or some screenshots. and let us know what theme do you use.
In the module configuration page ( /admin/modules ), make sure that the following module is enabled :
Contextual links (contextual)
I had the same issue and re-enabling this module solved the issue.