Cannot select Image File using djangocms-filer - django

I hope someone can help out with this one. I have been using djangocms to build a simple frontend centric website for a client so they can maintain their own content. There is nothing fancy in this setup. Just a few template.html files, a little css and djangocms to pull it all together. There are no other forms, models, views or anything at this stage. Just pure djangocms.
Originally I was working with django 1.8.6 and the image picker seemed to work fine. I could upload my files and next to each one there is a selector icon which works and all was great. See below image. This was using cmsplugin-filer.
Then I tried to upgrade the website to Django version 1.11.13 and I started to run into this problem. The file select that you see above is no longer available to the user. I have spent days working on this and in my travels I found that apparently cmsplugin-filer is now deprecated. So I removed it and switched to the recommended djangocms-filer install thinking that might solve my problem...but no. After many many hours of head scratching I figured it must be something in my project throwing things out, so I have done a 100% clean install using the prescribed djangocms-installer. Other than connecting it to a postgresql database, it is a completely vanilla installation, and yet it still does not work. All I get is the image below. A simple tick box but no way of selecting the image nor anyway of saving what I have selected. Uploading files is fine and I can create folders and images upload into them perfectly fine.
Below is a snapshot of my pip freeze showing everything installed in my virtualenv and the associated versions.
My settings file is almost 100% standard so I don't understand why I can't get this to work. Note: If, when I am adding the plugin to my template, I don't select the Choose File Button but simply drag an image into the grey rectangle, it all works fine. My file gets uploaded into the unsorted uploads folder and the image is selected into my template all in one go, but using the choose file route, where I have more control over my files and how they are stored, doesn't.
Does anyone have any idea what I might be missing please?
UPDATE:

Django CMS overrides some static files and there are some old ones in your browser cache. You need to clear your caches or open the page using incognito window.

Related

Django Admin Styling corrupted

I recently made some changes to my django site, one big one being upgrading from Django 2.2 to 3.1. Now my admin site styling is all messed up. I can't figure out what went wrong or how to fix. Any pointers would be appreciated!
See image of what it looks like after update....
The main home page for admin looks fine, but when I click on one of the models to view, the formatted is definitely not correct.
Also, some not all, of my images on the site are saying 404 not found...
It looks like your browser is caching the CSS / JS from the old version, you can clear your cache and reload. In chrome use ctrl + shift + r to reload.
I was facing the same problem, First I thought it was a Cache issue but it wasn't.
I checked the page source and found a css file being applied to the page which wasn't even present on my drive.
In my case the file was:
static/admin/css/nav_sidebar.css
So I created new file in static/admin/css named nav_sidebar.css,
then copy pasted the code which I got from page source and
added "display:none;" in the #nav-sidebar section(line:34) and [dir="rtl"] #nav-sidebar section(line:45 in my case).
You can find the Original code here by using Google Chrome's inspect tool.
Where to find the code
I had the same issue after bumping django from v3.0 to v3.1. I run python manage.py collectstatic to update css which solved my issue
I was experiencing the same styling as the OP's screenshots.
I had upgraded incrementally from 2.2 -> 3.0 -> 3.1 -> 3.2. I only experienced the styling issues in 3.2
The issue was that there were legacy admin styles committed to the repo in the static folder. To resolve, all I did was delete the committed admin styles, and Django then appeared to use its own styling
I was upgrading from 3.0 to 3.2 and I tried a couple of the answers here without luck. At the end, the following procedure solved it for me:
manually delete the content of the directory STATIC_ROOT (see in settings.py what you named the folder)
run the command python manage.py collectstatic This will repopulate the directory with the newst files
hard refresh your page (ctrl + F5)
I think the other answers here are necessary, but I'll add one more: You might have to bust caches in your server itself. In our example, nginx was configured to provide really long caches to our static files, so we just had to reset it to make changes come through.
Ok maybe I am late to the party but it may help others,
What works for me is:
Set STATIC_ROOT in settings.py (I guess it should be already there as project is old one)
Comment STATIC_DIR in STATICFILES_DIRS list (otherwise it will give error) and run python manage.py collectstatic
Clear browser cache.

Drupal 8 Generate all images for all styles

I'm working on a Drupal 8.6 multi site installation, where every site has it's own database, and I'm having a problem where the first time a content is shared on Facebook it uses the wrong image.
The meta tag is configured right, it is something like this:
<meta property="og:image" content="https://xxxx.com/image.jpg?itok=w8tMeCC0" />
This image problem happens only at the first share and I believe it happens because the image has not been created yet at the moment of the first share.
I would like to know what I could do to force the image to be generated as soon as the content is published and if there is a way to create all the missing images.
I found this post and I'm trying to implement in a module (I never worked on Drupal before) but I don't even know how to schedule this piece of script to be executed.
Is there an existing module or setting that does that?
Thanks for any help!
Have you tried the facebook Debugger?
https://developers.facebook.com/tools/debug/
Facebook usually stores the metatags in cache during shares. What I usually do is debug the webpage at least once with the right metatags configured in the debugger and ensure the page loads correctly there.
Afterwards, the share will be loading all the assets correctly.

Embedding a functional website inside a Squarespace webpage

First of all, thank you for everything that you do. Without this community, I would hate web design and be reliant on my teacher's outdated, static methods. Much love <3
So, this is a tricky one (maybe).
I want to have, essentially, an iframe on a webpage that contains a website I coded previously. It was a project for school that never went live, but I'd like to include it as part of my portfolio. Problem is, an iframe needs a URL for a source, but I just have the folder with more folders full of code, fonts, and images. How can I tell the browser to populate this box with everything from "name" folder? And then how will it know to run the code instead of just showing a file tree or something?
In the end, I want a page describing a previous web project and let the client experience that project within the one page. And I don't want to get a domain for every project I do.
Maybe there's an easier way I'm not thinking of?
To make it interesting, my new portfolio site is being made in Squarespace...maybe. I bought a domain from them because I had a promo code and wanted to try the platform, but I kind of hate it. I can't change any of the code and it won't maintain a connection to Typekit. So all I can do is change the basic appearance of preexisting elements. It's like WordPress all over again....LAME! Sadly, I already bought the domain.
Can Squarespace just be a host? Is there a way to download the raw code of these templates, edit it, and upload it again?
Thanks for all your help!
I want to have, essentially, an iframe on a webpage that contains a
website I coded previously.
Squarespace's file upload mechanism is very limited. Without using the Developers Platform, there is no effective way to upload many files at once. Furthermore, there is no way to create folders. Therefore, even if you were willing to upload each .html file and each asset one-by-one, there'd be no way to organize the files into folders (assuming that the "tree" you mentioned includes additional sub-folders).
Initially, in order to get the files to be accessible by Squarespace, you'd have to do one of the following:
Use Squarespace Developers Platform (A.K.A. "Developer Mode") and upload your to-be-iframed
(TBI) website files to the "assets" folder using SFTP or Git.
Host your TBI website files somewhere else (a different host
environment, for example) which will maintain your file/folder
structure.
How can I tell the browser to populate this box with everything from
"name" folder? And then how will it know to run the code instead of
just showing a file tree or something?
Assuming that the TBI website has an index.html file or home.html file or similar, and assuming you were to use the Squarespace Developer Platform, you'd insert the iframe either in a Code Block or within a template/.region file directly using something like
<iframe src="/assets/tbiwebsitefolder/index.html"></iframe>
while setting your other iframe attributes (such as height and width) as needed.
Is there a way to download the raw code of these templates, edit it,
and upload it again?
Yes. You select a template and then enable Developer Mode on that template. From there, you use SFTP or Git to download the template files, edit, and reupload.
You may benefit by reviewing some considerations of enabling Developer Mode on a Squarespace Template.
One other idea, to avoid the iframe and Developer Mode entirely, would be to capture images of the TBI website rendered in a browser, and then simply add those images to a gallery block or gallery page. This could allow you to convey the general idea of the project but would of course not capture the full "experience" of it.

Django Install Not Visible - No Errors

I recently did a successful Django install, and everything went as expected. No errors. But, nothing shows up. It is as if I had never installed Django.
There are no errors. Checking Django/Python versions returns as expected. From the console, I can create new projects/apps, run migrations, create users, etc. Everything seems to work. Except, when I go to mydomain.com, it just loads the old site's index.html as if Django doesn't exist.
I realize the above question isn't a good question. I figured out my problem before posting the question and decided to post my answer below with the question for future reference should others have the same issue later.
After the fruitless task of deleting and recreating my project files, I eventually figured out what happened with my Django installation. I had never enabled Passenger. On the web host in this case, DreamHost, it is just a simple checkbox in the control panel to enable, but I never did.
Other than the fact that I should have remembered I need to do enable Passenger for Django to show up, a couple things should have tipped me off. There was no tmp folder with a restart.txt file. I manually added it (that file's important), but didn't stop to think about why it wasn't there. Also, the html files were loading without being in the public folder.
That gave me an hour or so of frustration today, so I thought others might google this later and find this useful. Searching for "Django site has no errors but still doesn't work" wasn't a fruitful avenue for me.

How to integrate multiple image uploading with UPLOADIFY in django administration?

I met the django-uploadify (multiple file uploading) application, but the only template-use is described in wiki of the project. I need to integrate it with django admin. Any ideas?
#rebus and #Mordi have good suggestions; one of those is probably your best bet. Still...
The current implementation of file uploads in web browsers is single file only. That's a limitation of the HTML standards and the browsers themselves. When you see multiple file upload capability (all at once / select multiple) in some web app, something like Flash or Java is in play. You could potentially use a Flash or Java applet (check out Uploadify - about the easiest to work with you'll find), if you wanted, but you'd have to do some work tying it into Django: namely mapping the output of the applet to the input the Django Admin expects on POST.
Personally I found this package to be painful when I attempted to do this locally. It is 7 years old and not maintained. django-filer is a more modern implementation that has this exact functionality built into the admin panel, it was quick to set up and it seems to be maintained a lot better. And the UI is excellent!
If your really set on using uploadify my attempt was quite painful. When I went to the website to download the uploadify jQuery plugin it was a paid download. After looking a bit I found a fork, and was able to get it going locally, but because the python package is old it required a lot of changes from python 2.7..
To integrate this with your project in the admin will definitely require you to write your own custom admin template. In your admin.py you would have to override the default template and methods, this faq has some insights. In your new template you would include the uploadify jquery script and put the upload file field inside the form where your model fields would be. When you upload files the signal sender in the package will fire, and you would just have to intercept the signal and handle it with your intended logic
Very easy to implement multiple image upload with this project:
https://github.com/tstone/django-uploadify